Добрый день! Нужен макет сайта, с высотой и шириной 100%. Хэдер и Футер(прижат к низу окна) с фиксированной высотой 100px, а Центр - остаток высоты документа (height: 100%). Центр "разбит на две колонки, так, что бы они имели высоту 100% от родителя, тоесть от Центра. У меня в принципе получилось. Тоесть, в FF и Chrome отображается так, как мне и нужно (Высота сайта равна высоте окна, и не выезжает за ее пределы), а вот Opera почему то Центру применяет высоту 100% не от родителя, а от всего документа. (Как отобразиться в IE и других браузерах - не важно. Главное что бы на этих трех было правильно) Почему так? И как исправить это безобразие? Chrome сделал все правильно: Firefox тоже: Opera столкнул Футер ниже: Вот сообственно код: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>temp</title> <link rel="stylesheet" href="html5.css"> <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> </head> <body> <div id="wrapper"> <header>hed</header> <nav>test1 | test2 | test3</nav> <div id="main"> <div style="display: table; width: 100%; height: 100%"> <div id="sidebar">sidebar</div> <div id="content">content</div> </div> </div> <footer>fot</footer> </div> </body> </html> * { margin: 0; padding: 0; } html, body { height: 100%; } /* ————————————-- */ #wrapper { width: 100%; height: 100%; display: table; } header { height: 100px; display: block; background-color: darkgreen; } footer { height: 100px; display: block; background-color: darkgreen; } nav { height: 40px; display: block; background-color: darkblue; } #main { height: 100%; display: table-row; } #sidebar { width: 250px; display: table-cell; background-color: darkred; } #content { display: table-cell; background-color: grey; } PS: Знаю, что тема давно изъезжена, но облазив кучу сайтов в том числе и этот, я так и не смог найти то, что мне нужно. Пожалуйста помогите...
