ТвойWeb :: Версия для печати :: Блок занимает всю высоту окна

1. Хедин - 22 Октября, 2010 - 15:34:38 - перейти к сообщению

Как растянуть блок на всю высоту окна, если текста в нем мало.

CODE:

...
<div id="text">
Bla-bla-bla
</div>
...

#text {
background-color:#ccc;
width: 900px;
height: 100%;
margin: 0 auto;
border: 1px solid #FF0000;
}

height 100% ничего не делает

2. Ray Wen - 22 Октября, 2010 - 16:13:31 - перейти к сообщению

Высота в процентах не работает в современной спецификации... Вернее не так... Она приобретает высоту вышестоящего блока, и то, если высота в нём задана в единицах отличных от %. Так как body у нас так же не превышает высоту контента...

Нужно задать height:100%; width:100% для html и body...

3. Хедин - 22 Октября, 2010 - 16:39:19 - перейти к сообщению

Теперь растягивается. Спасибо!
Только снова проблема.

CODE:

body {
height: 100%;
padding: 10px 0 0 0;
}

Добавил отступ сверху и появляется полоса прокрутки, а она видите-ли не нужна Нахмурился

(Добавление)
И снова я со своими заморочками.

CODE:

<div id="content">
<div id="logo">...</div>
<div id="text">...</div>
<div id="footer">...</div>
</div>

#header {
height: 100px;
}

#text {
height: 100%;
}

#footer {
height: 30px;
}

подвал ушел вниз за границу окна. По сути мне надо подвал вниз опустить.

4. Ray Wen - 23 Октября, 2010 - 00:44:03 - перейти к сообщению

Придётся делать через position:absolute... и padding приплюсовывается к высоте/ширине...

5. Хедин - 23 Октября, 2010 - 04:58:48 - перейти к сообщению

Убрал отступ сверху - бог с ним.
Но вот никак не пойму как подвал приклеить к низу родительского блока.