Как сделать блок на всю высоту окна минус высоту шапки и футера - HTML и CSS

Qaliti · 09.07.2012, 15:08

В общем ситуация такая: есть страничка, на ней есть 4 блока, один прижат к окну сверху - шапка, имеет фиксированую высоту, ширина 100%. Ниже этой шапки идет два блока, одной строкой, то есть прижаты к друг другу, через float: left и display: inline-block, ширина у левого блока фиксированная, а другого 100% минус ширину левого, про высоту позже, здесь и есть сама проблема. Ну и последний блок футер, позиционирование абсолютное, ширина 100%, прижат к нижней части экрана, высота фиксированная. Когда написанно фиксированная это зачит в px, а не в %-ах.
Ну и вот сам вопрос: Как мне сделать резиновыми по высоте два блока в центре, в контент части, так чтоб они занимали все доступное место, но не незжали под футер и не появлялась полоса вертикальной прокрутки. Кратко - как мне задать высоту равной 100%-200px (пиксели взял от фанаря, но суть таже)?
И второй вопрос: Как задать ширину правого блока в контенте 100%-100px?

Пытался я сначало присвоить через javascript этим блокам высоту окна браузера, но отсеч потом от них высоту шапки и футера ни как не смог.

Qaliti · 10.07.2012, 05:58

пжалуста подскажите )))) это очень важно
если плохо объяснил - скажите, я предоставлю с кодом и скринами инфу

Valio · 10.07.2012, 08:29

Цитата:

Сообщение от Qaliti

пжалуста подскажите )))) это очень важно
если плохо объяснил - скажите, я предоставлю с кодом и скринами инфу

Гуглить не пытался?
http://forum.htmlbook.ru/index.php?showtopic=14847

тупо перваяже ссылка и первыйже код работает вроде как.

Код:

<html>

<body>



<div style="width:50%; background:#ccc; height:100%;">

<div style="width:100%; background:#666; height:300px;">

блок в котором будет ещё чё-нить

</div>

<div>Блок в котором будет всё остальное распологаться</div>

</div>



</body>

</html>

Qaliti · 19.07.2012, 13:20

не правильно... "блок в котором будет все остальное располагаться" не будет все остальное место занимать на экране, у него будет высота по высоте контента, и может выходить за пределы экрана - два ляпа

09.07.2012, 15:08	#1
Qaliti Форумчанин Регистрация: 04.01.2010 Сообщений: 229	Как сделать блок на всю высоту окна минус высоту шапки и футера В общем ситуация такая: есть страничка, на ней есть 4 блока, один прижат к окну сверху - шапка, имеет фиксированую высоту, ширина 100%. Ниже этой шапки идет два блока, одной строкой, то есть прижаты к друг другу, через float: left и display: inline-block, ширина у левого блока фиксированная, а другого 100% минус ширину левого, про высоту позже, здесь и есть сама проблема. Ну и последний блок футер, позиционирование абсолютное, ширина 100%, прижат к нижней части экрана, высота фиксированная. Когда написанно фиксированная это зачит в px, а не в %-ах. Ну и вот сам вопрос: Как мне сделать резиновыми по высоте два блока в центре, в контент части, так чтоб они занимали все доступное место, но не незжали под футер и не появлялась полоса вертикальной прокрутки. Кратко - как мне задать высоту равной 100%-200px (пиксели взял от фанаря, но суть таже)? И второй вопрос: Как задать ширину правого блока в контенте 100%-100px? Пытался я сначало присвоить через javascript этим блокам высоту окна браузера, но отсеч потом от них высоту шапки и футера ни как не смог.

Опции темы	Поиск в этой теме
Версия для печати Отправить по электронной почте	Поиск в этой теме: Расширенный поиск

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Определить высоту шапки сайта	Utkin	Общие вопросы Web	3	23.03.2012 15:20
Как узнать высоту (px) заголовка окна	zotox	Win Api	1	26.11.2010 16:08
как растянуть див на всю высоту клиентской части окна браузера	Anopsa - Anna	HTML и CSS	3	21.09.2009 10:07
div на всю высоту ячейки	Nikolay 0001	JavaScript, Ajax	5	30.11.2008 12:14
Как изменить высоту PopUpMenu Item	Comer_Jus	Общие вопросы Delphi	1	16.05.2008 14:26

10.07.2012, 05:58	#2
Qaliti Форумчанин Регистрация: 04.01.2010 Сообщений: 229	пжалуста подскажите )))) это очень важно если плохо объяснил - скажите, я предоставлю с кодом и скринами инфу

19.07.2012, 13:20	#4
Qaliti Форумчанин Регистрация: 04.01.2010 Сообщений: 229	не правильно... "блок в котором будет все остальное располагаться" не будет все остальное место занимать на экране, у него будет высота по высоте контента, и может выходить за пределы экрана - два ляпа