sayber

Т.е. тебе надо растягивать все, начиная с html. HTML->BODY->DIV-> и т.д. height 100% ставишь

Собственно я сделал то что требовалось. Но вот теперь в продолжении задачи совсем затупил =) Внутри блока который по центру, требуется разместить еще 5. Пример на изображении ниже. Т.е. имеются элементы id="header", id="left", id="right", id="footer", id="content". Каждый из них как то тянется. (см. атач) Но не выходить за рамки main. Есть какие идеи? CSS html, body { padding:0px; margin:0 auto; height:100%; width:100%; background-image:url(../../images/design/background.png); } header, footer, aside, nav, article, section { display: block; } #global { min-height:100%; position:relative; } #main { background-color:#2d2d2d; position: absolute; top: 25px; left: 25px; right: 25px; bottom: 25px; -moz-box-shadow: 0px 0px 8px #000; -webkit-box-shadow: 0px 0px 8px #000; box-shadow: 0px 0px 8px #000; padding:0px; border:1px solid #888; color:#FFF; } #left { background-color:#06F; position:relative; height:100%; width:60px; float:left; } #right { background-color:#3C6; position:relative; height:100%; width:260px; float:right; } #content { background-color:#FEFEFE; color:#444; position:relative; margin-left:60px; margin-right:260px; height:100% } #header { background-color:#FC3; position:relative; margin-left:60px; margin-right:260px; } #footer { background-color:#F0C; position:relative; margin-left:60px; margin-right:260px; } HTML <section id="global"> <div id="main" class="canvas"> <section id="left">left</section> <section id="right">right</section> <section id="header">header</section> <section id="content">content</section> <section id="footer">footer</section> </div> </section> В данные момент footer выползает за объект main

Ок. Только тему пока не закрывайте.

border-top-left-radius:10px; border-bottom-right-radius:10px; border-top-right-radius:10px; border-bottom-left-radius:10px; -moz-border-radius-bottomright:10px; -moz-border-radius-bottomleft:10px; -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px; -webkit-border-bottom-right-radius:10px; -webkit-border-top-left-radius:10px; -webkit-border-bottom-left-radius:10px; -webkit-border-top-right-radius:10px;

Почти что погорячился. Но я использую CSS3 с скруглением углов. Соответственно бордер не потянет =(( Т.к. внутренняя рамка становиться квадратной с острыми углами =( Или я как то не правильно понял.

Добрый день. Есть проблема, но не как не могу найти решение без использования js. Требуется див по центру экрана у которого высота 100% но при этом есть отступ. Соответственно при изменении окна браузера, должен тянуться див и не должен появляться вертикальный скролл. Собственно нынешний код (урезанный). <style> html, body { padding:0px; margin:0 auto; height:100%; width:100%; } #section { height:100%; } #content { height:100%; margin:20px; } </style> <div id="section"> <div id="content"> текст </div> </div> Как это должно выглядеть. P.S. Извиняюсь если подобная тема есть, но не нашел ее.