ykero

Спасибо!

Не ругайтесь, отцы! Когда-нибудь и я стану таким же умным как и вы)) Вопрос: а в таблице это дело не работает? Пример Если убираю табличные теги, то нормально растягивается по ширине

Речь про li.helper?

Короче то же самое что и было.. Может мне тоже отдохнуть денек другой Мини пример А при чём тут вообще display: inline;, речь шла о display: inline-block; Давай переделывай живо. Исправил, но видимо опять не там... Блин, ну не понимаю логику почему меню не растягивается по ширине, хоть убейте меня!

Короче то же самое что и было.. Может мне тоже отдохнуть денек другой Мини пример

Аналогично psywalker По данному способу у меня почему-то вообще получается вертикальное меню. Короче я в своем коде уже запутался

Мда, в IE6 и IE7 некорректно отображается, сразу не посмотрел.. Я так понимаю должен подойти 4 метод отсюда? Попробовал к своему коду применить данный способ, но выпадающее меню стало вообще отдельно показываться в левом верхнем меню. Помогите до ума довести, эти блоки уже 2 недели снятся!

Softlink Спасибо! То что нужно! А как бы еще вот так сделать? (немножко криво нарисовал, простите, но думаю смысл понятен)

Или так или растянуть по ширине, чтобы справа и слева было прижато к краям.

Доброго времени суток! Подскажите, пожалуйста, как сделать данное меню по центру или растянуть по ширине ячейки. <link rel="stylesheet" type="text/css" href="../CSS/cssmenustyles.css"> <table width="850" border="0" align="center"> <tr align="center"> <td align="center"><ul id="cssmenu"> <li><a href="#">Текст1</a> </li> <li><a href="#">Текст2</a> </li> <li><a href="#">Текст3</a> </li> <li><a href="#">Текст4</a> <ul> <li><a href="#">Текст5</a></li> <li><a href="#">Текст6</a></li> <li><a href="#">Текст7</a></li> </ul> <li><a href="#">Текст8</a> <ul> <li><a href="#">Текст9</a></li> <li><a href="#">Текст10</a></li> <li><a href="#">Текст11</a></li> <li><a href="#">Текст12</a></li> </ul> </li> <li><a href="#">Текст13</a> </li> <li><a href="#">Текст14</a> </li> </ul></td> </tr> </table> @charset "utf-8"; /* CSS Document */ ul#cssmenu { width: 850px; /* ширина всего блока меню */ margin: 0px auto; border: 0 none; padding: 0; list-style: none; background: #5875A1; height: 30px; font: bold 12px/28px Verdana, Arial; border-left:#5875A1 1px solid; } ul#cssmenu li { margin: 0; border: 0 none; padding: 0; float: left; display: inline; /* ? */ list-style: none; position: relative; height: 30px; } ul#cssmenu ul { margin: 0; border: 0 none; padding: 0; width: 160px; list-style: none; display: none; position: absolute; top: 30px; left: 0; } ul#cssmenu ul:after { clear: both; display: block; font: 1px/0px serif; content: "."; height: 0; visibility: hidden; } ul#cssmenu ul li { width: 190px; /* ширина выпадающей части */ float: left; display: block !important; display: inline; } /* Main Menu */ ul#cssmenu a { border: 0px; padding: 0 10px; float: none !important; float: left; display: block; background: #5875A1; color: #FFFFFF; font: bold 12px/28px Verdana, Arial; text-decoration: none; height: auto !important; height: 1%; } /* Main Menu Hover */ ul#cssmenu a:hover, ul#cssmenu li:hover a, ul#cssmenu li.iehover a { background: #FFFFFF; color:#5875A1; border-top:#5875A1 1px solid; } /* Second Menu */ ul#cssmenu li:hover li a, ul#cssmenu li.iehover li a { border-top: 2px solid #FFFFFF; float: none; background: #5875A1; color: #FFFFFF; } /* Second Menu Hover */ ul#cssmenu li:hover li a:hover, ul#cssmenu li:hover li:hover a, ul#cssmenu li.iehover li a:hover, ul#cssmenu li.iehover li.iehover a { border-top: 2px solid #FFFFFF; background: #FFFFFF; color:#5875A1; border:#5875A1 1px solid; } ul#cssmenu ul ul { display: none; position: absolute; top: 0; left: 170px; } ul#cssmenu li:hover ul ul, ul#cssmenu li.iehover ul ul { display: none; } ul#cssmenu li:hover ul, ul#cssmenu ul li:hover ul, ul#cssmenu li.iehover ul, ul#cssmenu ul li.iehover ul { display: block; }

Доброго времени суток! Подскажите, а как сделать центрирование блока по горизонтали в ячейке? Сейчас блок смещен влево. <link rel="stylesheet" type="text/css" href="../CSS/cssmenustyles.css"> <table width="850" border="0" align="center"> <tr align="center"> <td align="center"><ul id="cssmenu"> <li><a href="#">Текст1</a> </li> <li><a href="#">Текст2</a> </li> <li><a href="#">Текст3</a> </li> <li><a href="#">Текст4</a> <ul> <li><a href="#">Текст5</a></li> <li><a href="#">Текст6</a></li> <li><a href="#">Текст7</a></li> </ul> <li><a href="#">Текст8</a> <ul> <li><a href="#">Текст9</a></li> <li><a href="#">Текст10</a></li> <li><a href="#">Текст11</a></li> <li><a href="#">Текст12</a></li> </ul> </li> <li><a href="#">Текст13</a> </li> <li><a href="#">Текст14</a> </li> </ul></td> </tr> </table> @charset "utf-8"; /* CSS Document */ ul#cssmenu { width: 850px; /* ширина всего блока меню */ margin: 0px auto; border: 0 none; padding: 0; list-style: none; background: #5875A1; height: 30px; font: bold 12px/28px Verdana, Arial; border-left:#5875A1 1px solid; } ul#cssmenu li { margin: 0; border: 0 none; padding: 0; float: left; display: inline; list-style: none; position: relative; height: 30px; } ul#cssmenu ul { margin: 0; border: 0 none; padding: 0; width: 160px; list-style: none; display: none; position: absolute; top: 30px; left: 0; } ul#cssmenu ul:after { clear: both; display: block; font: 1px/0px serif; content: "."; height: 0; visibility: hidden; } ul#cssmenu ul li { width: 190px; /* ширина выпадающей части */ float: left; display: block !important; display: inline; } /* Main Menu */ ul#cssmenu a { border: 0px; padding: 0 10px; float: none !important; float: left; display: block; background: #5875A1; color: #FFFFFF; font: bold 12px/28px Verdana, Arial; text-decoration: none; height: auto !important; height: 1%; } /* Main Menu Hover */ ul#cssmenu a:hover, ul#cssmenu li:hover a, ul#cssmenu li.iehover a { background: #FFFFFF; color:#5875A1; border-top:#5875A1 1px solid; } /* Second Menu */ ul#cssmenu li:hover li a, ul#cssmenu li.iehover li a { border-top: 2px solid #FFFFFF; float: none; background: #5875A1; color: #FFFFFF; } /* Second Menu Hover */ ul#cssmenu li:hover li a:hover, ul#cssmenu li:hover li:hover a, ul#cssmenu li.iehover li a:hover, ul#cssmenu li.iehover li.iehover a { border-top: 2px solid #FFFFFF; background: #FFFFFF; color:#5875A1; border:#5875A1 1px solid; } ul#cssmenu ul ul { display: none; position: absolute; top: 0; left: 170px; } ul#cssmenu li:hover ul ul, ul#cssmenu li.iehover ul ul { display: none; } ul#cssmenu li:hover ul, ul#cssmenu ul li:hover ul, ul#cssmenu li.iehover ul, ul#cssmenu ul li.iehover ul { display: block; }