Сделал менюшку через список, внешне выглядит нормально, однако если начать крутить колесико, приближать отдалять, то целостность меню рушится, его кусок может перенестись на вторую строчку. Похоже браузер воспринимает это как список то есть может переносить слова и двигать пробелы.., а в таблице он жестко привязан.., как я понимаю, в этом плюс таблицы. Но мне нужно что бы было еще закругление, а в таблицах насколько я знаю закругление делается через картинки, использование картинок в менюшке не приемлемо!

Я видел сайты в которых менюшка сделана через списки и если начать мучить колесико ничего не переносится и не рушится как так сделать?

А можно посмотреть как это выглядит?

На верхней картинке приведена менюшка какой она должна быть, без вмешательства колесиком!
На средней картинке менюшка после приближения!
На последней нижней картинке показана менюшка при отдалении. Видно, что последний элемент меню сместился на вторую строчку, причем не по людски сместился а на половину! Так же можно увидеть, что при отдалении, сверху между менюшкой и шапкой появляется небольшой зазор.

Ниче не пойму.. ваш список генерируется скриптом PHP? Список - это тег <ul>?



Попробуйте содержимое ячеек обернуть в котейнер. Примените к этому контейнеру класс и нем укажите необходимый радиус закругления.

Нет, вполне обычный список и стили к нему

<div class="menu">
<ul>
<li><a class="left" href="/">Главная1</a></li>
<li><a href="/">Главная2</a></li>
<li><a class="right" href="/">Главная 3</a></li>
</ul></div>


<style>
.menu li { display:inline; margin: 1px;}

.menu li a {
background:#539E0D;
font-weight:bold;
font: 20px ATrebuchet MS; bold; color: #333232; font-weight:bold;
padding:3px 25px;
color:#ffffff;
text-decoration:none;
outline:none;
overflow: hidden;
}

.menu li a:hover {
background:#234A0B;
text-decoration:none;
}

.menu li a.right{
-moz-border-radius-bottomright: 50px;
-webkit-border-bottom-right-radius: 50px;
-khtml-border-bottom-right-radius: 50px;
border-bottom-right-radius: 50px;
}

.menu li a.left{
-moz-border-radius-bottomleft: 50px;
-webkit-border-bottom-left-radius: 50px;
-khtml-border-bottom-left-radius: 50px;
border-bottom-left-radius: 50px;
}
.menu ul {
height: 13px;
width: 1195px;
position: relative; left: 12px; zoom: 1;

}


</style>

Все таки бы хотелось через списки доделать, ибо через списки готово практически, где то что- то не учел.

Тогда почему эта тема в разделе по программированию на ПХП?)

Выложите код страницы целиком, чтобы увидеть глюк.

Но лично мне бросается в глаза одна вещь. У вас ссылки упакованы в тэг див. Высота для всего меню ul составляет 13px. В том время как для каждой ссылки высота составляет больше 20px. Выходит что каждая ссылка не влазит в меню..

Так уш вышло.)

Вот код страницы я в нем кое что изменил, высоту ul и ссылки подправил но это не помогло.


<div class="toppanel">
<div class="header">
<div class="logo"><a href="http://адрес сайта/"><img src="{THEME}/images/logo.jpg" ></a></div>
<div class="clock"><span id="thisdate"></span>, <span id="thistime"></span> </div>
</div>
</div>
</div>
<div class="menu3">
<ul>
<li><a class="left" href="/index.php">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Главная</a></li><li><a href="/">Категория</a></li><li><a href="/">Категория</a></li><li><a href="/">Категория</a></li><li><a href="/">Категория</a></li><li><a href="/">О проекте</a></li><li><a class="right" href="/index.php?do=rules">Правила на сайте</a></li></ul>
</div>

<style>

.menu3 li { display:inline; margin: 1px; vertical-align: 7px; font-size: 0px }

.menu3 li a {
background:#539E0D;
font-weight:bold;
font: 16px ATrebuchet MS; bold; color: #333232; font-weight:bold; ; font-family: verdana,sans-serif;
padding:9px 25px;
color:#ffffff;
margin: 0px;
text-decoration:none;
outline:none;
overflow: hidden;
}

.menu3 li a.right{
-moz-border-radius-bottomright: 50px;
-webkit-border-bottom-right-radius: 50px;
-khtml-border-bottom-right-radius: 50px;
border-bottom-right-radius: 50px;
}

.menu3 ul {
height: 16px;
width: 1195px;
position: relative; left: 12px; zoom: 1;

}

.menu3 li a.left{
-moz-border-radius-bottomleft: 50px;
-webkit-border-bottom-left-radius: 50px;
-khtml-border-bottom-left-radius: 50px;
border-bottom-left-radius: 50px;
}

.menu3 li a:visited {color:#ffffff; }

.menu3 li a:activ {color:#ffffff;}

.menu3 li a:hover {
background:#234A0B;
color:#ffffff;
text-decoration:none;
}

</style>

Если уменьшить ширину padding:9px 25px; до порогового значения перескакивания меню, то при при приближении, ничего не перескакивает, но так оставлять тоже нельзя слишком коротко и не красиво!

Ваш код на моих браузерах нормально работает. Глюков нет)

Спасибо что проверил! Наверное лучше бы этот код глючил. Буду разбираться дальше!