вариант через javascript:

Вроде не пашет у меня. Без javascript, как понимаю, нормального решения не существует?

надо в CSS подправить несколько параметров (в примере все изменения)


если ширина ul динамическая и заранее неизвестна, то просто на css не сделать

да что ты говоришь!?
тогда читай:



А дальше CSS:

[CSS]
#lang ul {
position: relative;
float: left; left: 50%;
border: 1px dashed #a00;
list-style: none;
margin: 0;
padding: 0;
}
#lang ul li {
position: relative;
float: left;
right: 50%;
border: 2px solid #0a0;
padding: 10px;
}
#lang {
overflow: hidden;
}
[/CSS]

есть ещо вариант:



СSS:
[CSS]
.parent {
width: 100%; /* ширина нужна, только если блок плавающий (float) */
text-align: center; /* обязательно делаем выравнивание по центру */
float: left; /* в данном примере float нужен чтобы высота блока была с учетом плавающего содержимого */
padding: 20px 0;
background: #6699FF;
}
ul {
display: table; /* элемент типа таблицы имеет ширину, зависящую от содержимого */
width: auto; /* для уверенности что ширина будет зависеть от содержимого*/
margin: 0 auto; /* устанавливаем отступ слева и справа в auto */
list-style: none;
font-size: 12px;
padding: 0;
}
* html .parent span {/*хак для IE6, который не понимает display: table*/
display: inline-block;
}
*:first-child+html .parent span {/*хак для IE7, который не понимает display: table */
display: inline-block;
}
li {
float: left;
margin-right: 4px;
width: 23px;
height: 19px;
overflow: hidden;
text-align: center;
color: #fff;
font-weight: bold;
position: relative;
background:url(images/testFonNeactiv.png);
cursor: default;
padding-top: 3px;
}
* html li {
height: 22px;
}
li a {
color: #fff;
text-decoration: none;
position: absolute;
top: 0;
left: 0;
display: block;
background:url(images/testFonActiv.png);
text-align: center;
width: 23px;
height: 22px;
padding-top: 3px;
}
[/CSS]

Так що не все так сумно у цьому житті! ^_^ :rtfm:

а можно в html заюзать <center></center> :D

а как насчет margin:0 auto;

Так у него еще в самом первом сообщении маргин прописан, вот я и подумал что он там не работает. Можно еще у div.navigation попробовать text-align: center; прописать, но об этом вроде как тоже уже писали, вот я самый грубый метод и предложил)

[CSS]
#topMenu {
font-family: Arial, Helvetica, sans-serif;
margin-top: 5px;
margin-right: auto;
margin-bottom: 5px;
margin-left: auto;
height: 40px;
width: 961px;
}
#topMenu ul {
margin: 0;
padding: 0;
list-style-type: none;
}
#topMenu li {
border:1px solid #EAE3D3;
border-radius:6px;
-webkit-border-radius:6px;
-moz-border-radius:5px;
-khtml-border-radius:10px;
text-align: center;
float: left;
margin-right: 5px;
}
#topMenu .withLine1 {
height: 40px;
width: 120px;
}
#topMenu .withLine2 {
height: 40px;
width: 180px;
}
#topMenu .withLine3 {
height: 40px;
width: 110px;
}
#topMenu .withLine4 {
height: 40px;
width: 150px;
}
#topMenu .withLine5 {
height: 40px;
width: 122px;
}
#topMenu .withLine6 {
height: 40px;
width: 110px;
}
#topMenu .withLine7 {
height: 40px;
width: 120px;
padding-right: 0px;
}

#topMenu a {
padding-top: 5px;
display: block;
text-decoration: none;
}


#topMenu a:hover {
font-family: Arial, Helvetica, sans-serif;
font-size: 24px;
font-weight: bold;
color:#FAA21A;
}
#topMenu a {
font-size: 20px;
color: #FFFFFF;
}
[/CSS]

Я начинающий, но делал так...чтобы и текст выровнять и картинки, и углы скруглить...кто ошибки увидит. скажите ПЛИЗ...Ту почему-то при уменьшении в браузере, кнопка контакты уходит вниз. И ни чего не могу исправить....[IMG]https://luckyway.info/c/1x1.gif?host=Lmh0bWwuYnk=[/IMG]

Вот пример http://vanzzo.net/html-css/vyiravnivanie-g...ml-menyu-p.html можно выровнять не используя JS

Замечание модератора: Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней. Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой или обратитесь к любому из модераторов.