div height 100% @ DeForum.ru

Три горизонтальных слоя. Первый и третий слои имеют фиксированную высоту. Второй, он же центральный, должен заполнять оставшееся пространство. Как проще и надёжнее это воплотить? :chih:

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

maximumx писал(а):

Три горизонтальных слоя.

Стандарт: хидер, контент, футер. Поищите в интернет и в этом разделе. Да, главное, когда будете искать, обратите внимание на фразы, вроде "прибить футер/подвал к низу страницы".

Spase писал(а):

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

Идея интересная, только не тянется слой.

Код:

#page {height: 100%; top: 40px; bottom: 40px;}

Беда в том, что мне ещё надо в центральный слой вставить iframe с заполнением по высоте, при этом ещё большая каша получается. Выходит только с относительными размерами всех трёх слоёв. :chih:

tentoys писал(а):

Стандарт: хидер, контент, футер. Поищите в интернет и в этом разделе. Да, главное, когда будете искать, обратите внимание на фразы, вроде "прибить футер/подвал к низу страницы".

Там либо про таблицы, либо не универсальные приёмы.

tentoys писал(а):

maximumx писал(а):

Три горизонтальных слоя.

обратите внимание на фразы, вроде "прибить футер/подвал к низу страницы".

про подвал..

http://www.zakharov.ms/footer/

maximumx писал(а):

Там либо про таблицы, либо не универсальные приёмы.

Да? Вот так пойдёт?

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<style>
html {height:100%;margin:0;padding:0;color:#000;}
body {margin:0;padding:0;height:100%;min-height:100%;background:#fff;}
div, div#content {position:absolute;z-index:1;}
#content{background:#ffffcc;top:150px;bottom:100px;width:100%;}
#topp {top:0%;height:150px;width:100%;background:#f0f0f0;}
#bottom {bottom:0;height:100px;width:100%;background-color:#b0b0b0;}
</style>
<title>exapmle</title>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=windows-1251" />
</head>
<body>
<div id="topp">верхний див</div>
<div id="content">контент</div>
<div id="bottom">нижний див</div>
</body>
</html>

0 Сообщения: 6 Зарегистрирован: 28.04.08

maximumx писал(а):

Spase писал(а):

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

Идея интересная, только не тянется слой.

Код:

#page {height: 100%; top: 40px; bottom: 40px;}

Беда в том, что мне ещё надо в центральный слой вставить iframe с заполнением по высоте, при этом ещё большая каша получается. Выходит только с относительными размерами всех трёх слоёв. :chih:

существует ли что-то, что можно вывести в ифрейм но нельзя вывести в див?

t3s писал(а):

существует ли что-то, что можно вывести в ифрейм но нельзя вывести в див?

Существует. К примеру, текстовая информация. Вопрос-то в чём?

tentoys писал(а):

Да? Вот так пойдёт?

Да, отличный кроссбраузерный вариант для текста. :cool:

Но если в центральный слой вставить iframe, то можно заметить, что данный вариант под IE не работает. Чтобы iframe растягивался по высоте, IE требует для центрального слоя значение height:100%, в противном случае мы видим дефолтные для iframe 150px.

maximumx писал(а):

Но если в центральный слой вставить iframe, то можно заметить, что данный вариант под IE не работает.

мнээээ... afair в XHTML 1.1 упоминаний о iframe нету, поэтому он и не может там правильно отображаться. Эт' я чего-то не подумал. Попробуйте другой доктайп, например HTML 4.01. Или, попробуйте вместо iframe использовать object:

Код:

<object data="text-block.html" type="text/html" width="что-нибудь" height="что-нибудь"></object>

А, к примеру SSI у Вас нет возможности использовать?

DeДверь
Логин:
Пароль:
	Автологин