Доброго времени суток. Я искал оптимальную реализацию вертикального растягивания колонок в CSS по аналогии со свойствами таблиц и сверстал шаблон, основываясь на примере от Ste Nicholls, выложенном на его сайте CSS_Play - cssplay.co.uk/layouts/3cols2.html.
Итак, мой шаблон корректно отображается в Firefox 2.0, Opera 9. В Internet Explorer'е 7 левая колонка постоянно "скачет", смещаясь на пол экрана. В Safari колонка на несколько пикселей сдвинута вправо.
Пример выложил в сеть, можете посмотреть здесь: polygon.cre-active.eu
Использована след. конструкция, с помощью которой достигается 3-хкол. макет:
HTML (шаблон для Joomla - не обращайте внимания на куски PHP-кода):Цитата:
#container_des {position:relative; display:block; background:url(../images/backgr.png); border-left:223px solid #170100; border-right:223px solid #170100; overflow:visible; padding-bottom:10px;}
#left_des {float:left; position:relative; width:222px; margin-left:-222px; display:inline;}
#right_des {float:right; position:relative; width:222px; margin-right:-222px; display:inline;}
.clear_des {clear:both;height:1px;overflow:hidden;}
* * * * * * </div>Цитата:
<div id="top3">
<div id="container_des">
* * * <div id="right_des">* * * * * * * * * *
* * * <div id="rightcol-normal">
* * * * * * * * * * * * <?php
* * * * * * * * * * * * if (mosCountModules( "right" )) {
* * * * * * * * * * * * * * * * mosLoadModules ( 'right',-3);
* * * * * * * * * * * * }
* * * * * * * * * * * * ?>* * * * * *
* * * *
* * * * * * * * * * * *
* * * <div id="left_des">
* * * * <div id="leftcol"><a name="menu"></a>
* * * * * * * * * * * * <?php
* * * * * * * * * * * * if (mosCountModules( "left" )) {
* * * * * * * * * * * * * * * * mosLoadModules ( 'left',-3);
* * * * * * * * * * * * }
* * * * * * * * * * * * ?></div>* * * * *
* * * * * * * * * </div>
* <div class="content">
* * * * * * * * * * * * * * * * <a name="content"></a>
* * * * * * * * * * * * * * * * <?php mosMainBody(); ?>
* * * * * * * * * * * * </div>* * * * * * *
* * *
</div>
</div>[/quote]
Суффиксы модулей в данном случае не влияют - отключал, эффект тот же.
Второй, более глобальный глюк, объяснение которому я не могу найти: в некоторых моментах часть контента начинает выводиться в самом низу основого поля текста, сразу после самого нижнего модуля левого или правого краев (во всех браузерах). Во вложении картинка, которая наглядно демонстрирует данный глюк.
На моем сайте этот глюк появляется в двух случаях: в меню Community Builder и при использовании Ajax Vote от Joomla Works.
Касаемо этого примера, прошу опробовать:
polygon.cre-active.eu
user name: user
password: 111222111
Зайдите под данным профилем и кликните в "change my profile" - появится Community Builder и этот глюк. Скриншот в приложении.
Курьезно, но причина именно в примере от Stu Nocholls (я специально убрал свой код и оставил чистый оригинал), ибо в др. шаблоне данного странного поведения не обнаруживается. Скорее всего, не прописано какое-то свойство или.... в общем, прошу помощи, ибо не знаю, в чем ошибка.
Я специально использовал исходник 3-х колоночного макета от гуру CSS верстки во избежании кривизны, но к сожалению, что-то не учтено. Должен заметить, что данный глюк появляется в некоторых случаях, т.к. если размещать обычный HTML текст, данной проблемы нет)
Очень прошу уважаемое сообщество помочь в решении данного вопроса, т.к. очень не хочется верстать табличным способом.
