[/quote]
Вообще, данная тема является весьма интересной.![]()
Вопрос реализации средствами CSS трехколоночного макета с боковыми колонками фиксированной ширины некоторое время назад очень будоражил умы многих известных людей. Предлагались разнообразные подходы к решению данной задачи... На мой взгляд, решение, описываемое в статье на [Только зарегистрированные пользователи могут видеть ссылки. ], не является оптимальным. На сегодняшний день все это можно смоделировать намного проще:
1. Можно спокойно обойтись без отрицательных полей.
2. Совершенно нет никакой необходимости плодить лишние обрамляющие блоки (container, wrapper и outer_wrapper) для задания фонового цвета (или изображения) методом Faux Columns. Для этой цели можно спокойно использовать элементы <html> и <body>.
3. Совсем не обязателен дополнительный "выключающий" блок div.clearing...
Вот совсем небольшой шаблон, выработанный мной некоторое время назад:
Код:* {margin: 0px; padding: 0px;} html {background: url(bg_left.gif) #FFFFCC repeat-y left top; height: 100%;} body {background: url(bg_right.gif) repeat-y right top; min-width: 776px; min-height: 100%; position: relative;} * html body {height: 100%;} #header {background: #D5EAFF; width: 100%; height: 100px;} #content {width: 100%; padding-bottom: 70px; overflow: hidden;} #menu {width: 200px; float: left;} * html #menu {margin-right: -3px;} #news {width: 200px; float: right;} * html #news {margin-left: -3px;} #main {margin: 0px 200px;} * html #main {height: 1%; margin: 0px 197px;} #footer {background: #66FFCC; width: 100%; height: 70px; position: absolute; bottom: 0px;} * html #footer {bottom: -1px;}Отрицательные поля здесь присутствуют в иных целях – исключительно для решения проблемы с трехпиксельными отступами у float-ов в IE.Код:<div id="header">Header</div> <div id="content"> ****<div id="menu">Menu</div> ****<div id="news">News</div> ****<div id="main">Main</div> </div> <div id="footer">Footer</div>
Ну и, конечно же, возможны варианты...
[attachment=5531:attachment]
[attachment=5532:attachment]




