redfox1986

если честтно то ничего не понял, вот еще тока заметил что если на сайте http://jsfiddle.net/ в примерах делать и прописать <div class="ldd_submenu" style="width: 460px"> то вроде все работает, а вот на сайте самом не хочет ( да еще блок когда выдвигается под ним яндекс директ, и получается что ссылка яндекс директ и все объявления накладываются поверх выезжаюшего меню, хоть я и поставил z-index / это надо заключить яндекс директ в див ? чтобы ненакладывалась ?

я напроч запутался в иерархии css вобщем есть у меня меню при навидении на блок меню выпадает подменю, так вот подменю должжно быть разной ширины для разных пунктов меню ссылка на пример http://jsfiddle.net/p6LHn/1/ вот код css /**Меню css**/ ul.ldd_menu { margin: 0px; padding: 0; display: block; height: 50px; background-color: #0051A1; list-style: none; font-family: "Trebuchet MS", sans-serif; border-top: 1px solid #3474C6; border-bottom: 1px solid #3474C6; border-left: 10px solid #0051A1; -moz-box-shadow: 0px 3px 4px #007BC2; -webkit-box-shadow: 0px 3px 4px #007BC2; -box-shadow: 0px 3px 4px #007BC2; } ul.ldd_menu a { text-decoration: none; } ul.ldd_menu > li { float:left; position:relative; } ul.ldd_menu > li > span { float: left; color: #fff; background-color: #0051A1; height: 50px; line-height: 50px; cursor: default; padding: 0px 20px; text-shadow: 0px 0px 1px #fff; border-right: 1px solid #3474C6; border-left: 1px solid #0049A1; } ul.ldd_menu .ldd_submenu { position:absolute; z-index: 2; top: 50px; display: none; opacity: 0.9; left: 0px; font-size: 10px; background: #0051A1; border-top: 1px solid #3474C6; -moz-box-shadow: 0px 3px 4px #0051A1 inset; -webkit-box-shadow: 0px 3px 4px #0051A1 inset; -box-shadow: 0px 3px 4px #0051A1 inset; } a.ldd_subfoot{ background-color: #f0f0f0; color: #444; display: block; clear: both; padding: 15px 20px; text-transform: uppercase; font-family: Arial, serif; font-size: 12px; text-shadow: 0px 0px 1px #fff; -moz-box-shadow: 0px 0px 2px #777 inset; -webkit-box-shadow: 0px 0px 2px #777 inset; -box-shadow: 0px 0px 2px #777 inset; } ul.ldd_menu ul { list-style: none; float: left; border-left: 1px solid #2A6DC3; margin: 20px 0px 10px 30px; padding: 10px; } li.ldd_heading { font-family: Georgia, serif; font-size: 13px; font-style: italic; color: #69C3FF; text-shadow: 0px 0px 1px #B03E23; padding: 0px 0px 10px 0px; } ul.ldd_menu ul li a { font-family: Arial, serif; font-size: 10px; line-height: 20px; color: #fff; padding: 1px 3px; } ul.ldd_menu ul li a:hover { -moz-box-shadow: 0px 0px 2px #2A6DC3; -webkit-box-shadow: 0px 0px 2px #2A6DC3; box-shadow: 0px 0px 2px #2A6DC3; background: #007BC2; } /**конец Меню css**/ вот сам код в документе <ul id="ldd_menu" class="ldd_menu"> <li> <span>Благоустройство дачи</span> <div class="ldd_submenu"> <ul> <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 href="#">Советы дачникам</a></li> </ul> <a class="ldd_subfoot" href="#"></a> </div> </li> <li> <span>Сад и огород</span> <div class="ldd_submenu"> <ul> <li class="ldd_heading">Фрукты и ягоды</li> <li><a href="#">Клубника</a></li> <li><a href="#">Крыжовник</a></li> <li><a href="#">Малина</a></li> <li><a href="#">Смородина</a></li> </ul> <ul> <li class="ldd_heading">Овощи</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 href="#">Зелень и травы</a></li> </ul> <ul> <li class="ldd_heading">Деревья и кустарники</li> <li><a href="#">Яблоня</a></li> <li><a href="#">Малина</a></li> <li><a href="#">Крыжовник</a></li> </ul> <ul> <li class="ldd_heading">Цветы на даче</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> </ul> <ul> <li class="ldd_heading">Комнатные растения</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> </ul> <ul> <li class="ldd_heading">Делимся опытом</li> </ul> <ul> <li class="ldd_heading">Болезни и вредители</li> </ul> <a class="ldd_subfoot" href="#"> + Еще ссылка</a> </div> </li> <li> <span>Меню №3</span> <div class="ldd_submenu"> <ul> <li class="ldd_heading">Заголовок №1</li> <li><a href="#">Ссылка №1</a></li> <li><a href="#">Ссылка №2</a></li> <li><a href="#">Ссылка №3</a></li> <li><a href="#">Ссылка №4</a></li> <li><a href="#">Ссылка №5</a></li> </ul> <ul> <li class="ldd_heading">Заголовок №2</li> <li><a href="#">Ссылка №1</a></li> <li><a href="#">Ссылка №2</a></li> <li><a href="#">Ссылка №3</a></li> <li><a href="#">Ссылка №4</a></li> <li><a href="#">Ссылка №5</a></li> </ul> <ul> <li class="ldd_heading">Заголовок №3</li> <li><a href="#">Ссылка №1</a></li> <li><a href="#">Ссылка №2</a></li> <li><a href="#">Ссылка №3</a></li> <li><a href="#">Ссылка №4</a></li> <li><a href="#">Ссылка №5</a></li> </ul> <a class="ldd_subfoot" href="#"> + Еще ссылка</a> </div> </li> </ul> как я понял за подменю блок отвечает class="ldd_submenu" если к примеру сделать так ul.ldd_menu .ldd_submenu { position:absolute; z-index: 2; top: 50px; [b]width: 180px;[/b] display: none; opacity: 0.9; left: 0px; font-size: 10px; background: #0051A1; border-top: 1px solid #3474C6; -moz-box-shadow: 0px 3px 4px #0051A1 inset; -webkit-box-shadow: 0px 3px 4px #0051A1 inset; -box-shadow: 0px 3px 4px #0051A1 inset; } то тогда у всех подменю будет ширина 180 пикселей если сделать так ul.ldd_menu .ldd_submenu { position:absolute; z-index: 2; top: 50px; [b]width: 180px;[/b] display: none; opacity: 0.9; left: 0px; font-size: 10px; background: #0051A1; border-top: 1px solid #3474C6; -moz-box-shadow: 0px 3px 4px #0051A1 inset; -webkit-box-shadow: 0px 3px 4px #0051A1 inset; -box-shadow: 0px 3px 4px #0051A1 inset; } ul.ldd_menu .ldd_submenu2 { position:absolute; z-index: 2; top: 50px; [b]width: 480px;[/b] display: none; opacity: 0.9; left: 0px; font-size: 10px; background: #0051A1; border-top: 1px solid #3474C6; -moz-box-shadow: 0px 3px 4px #0051A1 inset; -webkit-box-shadow: 0px 3px 4px #0051A1 inset; -box-shadow: 0px 3px 4px #0051A1 inset; } а в документ вставить <div class="ldd_submenu"> .... бла бла бла <div class="ldd_submenu2"> ... бла бла бла то первый блок будет 180пикселей а второй получается меньше но не 480 как надо, в чем проблемма, никак непойму иерархию этого кода да вот еще код в документе <script type="text/javascript"> $(function() { var $menu = $('#ldd_menu'); $menu.children('li').each(function(){ var $this = $(this); var $span = $this.children('span'); $span.data('width',$span.width()); $this.bind('mouseenter',function(){ $menu.find('.ldd_submenu').stop(true,true).hide(); $span.stop().animate(300,function(){ $this.find('.ldd_submenu').slideDown(300); }); }).bind('mouseleave',function(){ $this.find('.ldd_submenu').stop(true,true).hide(); $span.stop().animate({'width':$span.data('width')+'px'},300); }); }); }); </script> Помогите понять как расширить последующие блоки подменю меню

можно немного поподробнее а то не понял )

не не помогает, все перепробывал (, я предполагаю, где в коде чтото нетак, но найдти немогу, вот думаю может как по другому можно если ставить float: right; то будет так контенттттт___бар1 контенттттт___бар2 _____бар3_____бар4 а было контенттттт___бар1 контенттттт___бар2 бар3____бар4______

вобщем пока додумался только вот заключить весь код sidebar в <table> <tr> <td> </td> </tr> </table>

Добрый вечер знатоки css и HTML, у меня появилась проблемма, вернее она была но вот никак немогу ее решить, прошу помощи ! вобщем есть сайт вордпресс движок, есть неплохой шаблон, который я немного переделал, но вот незадача мой sidebar нижная его часть, уходит влево, при условии что основного контента мало , тоесть некоторые блоки уходят под контент и правый sidebar не растягивается по вертикали вот прилагаю ссылку http://osadovod.ru/tag/malina А вот если контента много http://osadovod.ru/bolezni-i-vrediteli-rastenij-chast-pervaya-bolezni.html код темы замудренный, вот див который отвечает за бар #sidebar{float:left;width:322px;} Голову уже сломал как сделать так чтобы sidebar растягивался по вертикали если добавляются виджеты, вне зависимости сколько контента в основной части сайта! HELP