zaero

Так и сделал. Заключил баннеры в дивы с display: none; а на body.onLoad скриптом ставлю дивам display: block; Большое спасибо за помощь!

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

После добавления диву-контейнеру маргины-паддинги 0 и overflow:hidden все стало отображаться как надо. Вы правы, мое решение поменять стиль "clear: both" на "clear: none" в корне неверно. Обнаружил аналогичную проблему у другого компонента, и после попытки исправить стили выглядеть он стал весьма печально. Вылечил аналогично - обрамлением в див-контейнер. Огромное вам человеческое спасибо за помощь! ЗЫ. Стили для <div id="details"></div> еще нужны?

div.adsmanager_ads_body { float: left; width: 67%; } div.adsmanager_ads_image { border: 1px solid #FFFFFF; float: left; width:30%; padding: 5px; text-align : center; } div.adsmanager_ads_image a{ display : block; margin-top: 10px; } div.adsmanager_ads_image a img{ border: none; }

Див-контейнер это <div></div> верно? Но если я делаю вот так: <div class="adsmanager_ads_main"> <!--контейнер--> <div> <div class="adsmanager_ads_body"> <div class="adsmanager_ads_desc"> <b></b>Отдам тональник. Maybelline affinitone. светленький. 09. колпачек правда пожульканый.<br />Состояние: Хорошее<br /> </div> <div class="adsmanager_ads_price"> <b>Город: </b>Томск<br /> </div> <div class="adsmanager_ads_contact"> <b>Контакты:<br/></b>Контактное лицо: Полина<br /><br /> </div> </div> <div class="adsmanager_ads_image"> <a href='http://prosto-tak.tomsk.ru/images/com_objmanager/pics/8717a.jpg' target='_blank'><img src='http://prosto-tak.tomsk.ru/images/com_objmanager/pics/8717a_t.jpg' alt='Тональник' /></a><a href='http://prosto-tak.tomsk.ru/images/com_objmanager/pics/8717b.jpg' target='_blank'><img src='http://prosto-tak.tomsk.ru/images/com_objmanager/pics/8717b_t.jpg' alt='Тональник' /></a> </div> <div class="adsmanager_spacer"></div> </div> </div> то результат прежний - нижняя граница тянется вниз

А какое решение порекомендуете?

Аллилуйя, проблема решена! Все дело в диверсионном css параметре: clear: both; Как вычислил: после удаления строки <div class="adsmanager_spacer"></div> растягивание исчезло, но и кнопка "Назад" улетела вверх. Пошел смотреть css класс "adsmanager_spacer". Выглядит вот так: .adsmanager_spacer { clear: both; } Поменял на .adsmanager_spacer { clear: none; } и растягивание исчезло (при отсутствии компонента комментариев). Такую же операцию произвел с css компонента комментариев и все заработало как надо. Огромное вам спасибо за помощь!

К сожалению не она - я попробовал убрать ее всю, но проблема никуда не делась

Ессть тестовый на локале, и рабочий на хостинге.

Да вы правы, закрывающих тегов не хватает. Однако проблема к сожалению не в этом - я сохнанил html, доставил недостающие теги руками и открыл снова. Проблема по прежнему присутствует - в FireFox, Chrome и Opera компонент тянется до низа правой колонки. В IE как и раньше, все отображается как надо. Может существует какое-то хитрое свойство у div'a, о существовании которого я не подозреваю?

Вот. Прошу прощения за еще одну портянку - как видите, тег "спойлер" не помогает. Div класс который растягивается до нижней границы правой колонки: <div class="adsmanager_ads">

Доброго времени суток, уважаемые знатоки css. При верстке у меня возникла довольно странная проблема. Описать ее непросто, но я постараюсь. Шаблон сайта сверстан в 3 колонки с помощью div-ов. При открытии одного из компонентов в FireFox, Chrome или Opera происходит довольно странная вещь - главная область компонента растягивается вниз так, чтобы нижний конец стал вровень с нижней границей правой или левой колонки. При этом в IE все отображается как надо. Проблема в картинках: Вот как это выглядит в IE (как оно должно выглядеть): Нижняя граница компонента заканчивается там, где кончается текст компонента. Нижние границы правой и левой колонки ни на что не влияют. А вот как это выглядить в FireFox, Chrome или Opera (моя печаль): Нижняя граница компонента растянута так, чтобы совпадать с нижней границей правой колонки. Если я добавлю в правую колонку еще модули - граница растянется еще ниже. При добавлении модулей в левую колонку, поведение аналогично. Подскажите пожалуйста, в чем может быть проблема? заранее благодарен. Прошу прощения за портянку, спойлеры вставить не получилось. Фрагмент HTML: Фрагмент CSS: #maincontent { padding: 0px 16px; } #left_out { width: 188px; float: left; padding: 0; margin: 0; } #right_out { width: 182px; float: right; padding: 0; margin: 0; } #left_out ul, #left_out li, #right_out ul, #right_out li { list-style-type: none; padding: 0; margin: 0; } #left_out ul.menu li a, #left_out ul.menu li#current a, #left_out a.mainlevel, #right_out ul.menu li a, #right_out ul.menu li#current a, #right_out a.mainlevel { display: block; height: 25px; line-height: 25px; background-repeat: no-repeat; background-position: left; width: 172px; font-size: 12px; !important; font-weight: normal; text-indent: 20px; !important; } #left_out ul.menu a:hover, #right_out ul.menu a:hover, #left_out a.mainlevel:hover, #right_out a.mainlevel:hover, #left_out #active_menu, #right_out #active_menu, #left_out ul.menu li#current a, #right_out ul.menu li#current a { background-image: url(../images/mainlevel_over.gif); text-decoration: none; background-repeat: no-repeat; background-position: left; color: #000000; !important; } #left_out a.sublevel, #left_out ul.menu li#current li a, #left_out ul.menu li li a, #left_out ul.menu li li#current a, #left_out ul.menu li li#current li a, #left_out ul.menu li li li a, #right_out a.sublevel, #right_out ul.menu li#current li a, #right_out ul.menu li li a, #right_out ul.menu li li#current a, #right_out ul.menu li li#current li a, #right_out ul.menu li li li a { background-repeat: no-repeat; height: 20px; line-height: 20px; background-position: left; text-indent: 20px; !important; border: none; display: block; } #left_out a.sublevel#active_menu, #right_out a.sublevel#active_menu, #left_out a.sublevel:hover, #right_out a.sublevel:hover, #left_out ul.menu li#current li a, #left_out ul.menu li li#current a, #left_out ul.menu li li#current li a, #right_out ul.menu li#current li a, #right_out ul.menu li li#current a, #right_out ul.menu li li#current li a, #left_out ul.menu li#current a:hover, #right_out ul.menu li#current a:hover, #left_out ul.menu li li a:hover, #right_out ul.menu li li a:hover{ text-decoration: none; background-repeat: no-repeat; background-position: left; color: #000000; !important; } #left_out .module, #right_out .module, #left_out .moduletable, #right_out .moduletable, #left_out .module_menu, #right_out .module_menu, #left_out .module_text, #right_out .module_text { background-repeat: repeat-y; margin-top: 5px; } #left_out .module div, #right_out .module div, #left_out .moduletable div, #right_out .moduletable div, #left_out .module_menu div, #right_out .module_menu div, #left_out .module_text div, #right_out .module_text div { background-position: bottom; background-repeat: no-repeat; width: 182px } #left_out .module div div, #right_out .module div div, #left_out .moduletable div div, #right_out .moduletable div div, #left_out .module_menu div div, #right_out .module_menu div div, #left_out .module_text div div, #right_out .module_text div div { background-position: top; background-repeat: no-repeat; } #left_out .module div div div, #right_out .module div div div, #left_out .moduletable div div div, #right_out .moduletable div div div, #left_out .module_menu div div div, #right_out .module_menu div div div, #left_out .module_text div div div, #right_out .module_text div div div{ background: none; padding: 5px 5px 10px 5px; overflow: hidden; width: 172px; } #left_out .module div div div div, #right_out .module div div div div, #left_out .moduletable div div div div, #right_out .moduletable div div div div, #left_out .module_menu div div div div, #right_out .module_menu div div div div, #left_out .module_text div div div div, #right_out .module_text div div div div { padding: 0; } #left_out h3, #right_out h3 { height: 35px; width: 172px; background-repeat: no-repeat; color: #FFFFFF; line-height: 35px; text-indent: 20px; padding: 0; margin: 0 0 5px 0; font-size: 14px; font-weight: bold; } #content_outleft, #content_outmiddle, #content_outright { margin: 0 0 10px 0; padding-top: 5px; } #content_outleft { margin: 0 0 0 188px; } #content_outmiddle { margin: 0 188px; } #content_outright { margin: 0 188px 0 0; } #content { background-repeat: repeat-x; background-position: bottom; width: 100%; } #content_border_left { background-repeat: repeat-y; background-position: top left; } #content_border_right { background-repeat: repeat-y; background-position: top right; } #content_bottom_right { background-repeat: no-repeat; background-position: bottom right; } #content_bottom_left { background-repeat: no-repeat; background-position: bottom left; padding: 3px 5px 5px 5px; }