<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ru" xml:lang="ru">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<style type="text/css">
h1 {margin:0;}
body{margin:0;padding:0; color: white;}
#block {width: 100%; overflow: hidden; background: #f00;}
#leftcol,#centercol,#rightcol{float: left; margin-bottom: -30000px; padding-bottom: 30000px;min-height:10px; color: black;}
#leftcol { background: #ff0;width: 25%;}
#centercol {width: 49.9%; background: #ffa800;}
#rightcol { width: 25%; background: #f00;}
#header,
#footer{clear:both;height:auto!important;height:50px;min-height:50px;background:green}
.margin_small{margin:10px;}
</style>
<style type="text/opera">
#centercol {width: 50%;}
</style>
</head>
<body>
<div id="header"></div>
<div id="block">
<div id="leftcol">
<div class="margin_small">
<ul>
<li><a href="#">Главная</a></li>
<li><a href="#">Проект 1</a></li>
<li><a href="#">Проект 2</a></li>
<li><a href="#">Новый проект</a></li>
</ul>
</div>
</div>
<div id="centercol">
<div class="margin_small">
<h1 class="title"><span>Заголовок проекта</span></h1>
<div class="form">
</div>
</div>
</div>
<div id="rightcol"><div class="margin_small">Правая колонка</div></div>
</div>
<div id="footer">Подвал</div>
</body>
</html>
Стопроцентная высота и прочее
Замучался я уже искать универсальное кроссбраузерное решение :( :confused:
Во-первых, можно ли заставить родительский контейнер "охватывать" дочерние со стилями "float: left" и "position: absolute"?
Во-вторых, каким образом, имея совокупность дочерних плавающих элементов внутри родительского контейнера, заставить их соответствовать по высоте родительскому и, соответственно, друг другу?
Первое со вторым уж вообще никак не хочет сочетаться :(
Если выставить min-height для родительского контейнера (чтобы он гарантированно включал в себя ребенка с "position: absolute" хотя бы фиксированной высоты), перестает работать 100% высота для других его дочерних элементов с "float: left"... Устал уже с этой ерундой воевать... :(
Во-первых, можно ли заставить родительский контейнер "охватывать" дочерние со стилями "float: left" и "position: absolute"?
Во-вторых, каким образом, имея совокупность дочерних плавающих элементов внутри родительского контейнера, заставить их соответствовать по высоте родительскому и, соответственно, друг другу?
Первое со вторым уж вообще никак не хочет сочетаться :(
Если выставить min-height для родительского контейнера (чтобы он гарантированно включал в себя ребенка с "position: absolute" хотя бы фиксированной высоты), перестает работать 100% высота для других его дочерних элементов с "float: left"... Устал уже с этой ерундой воевать... :(
Цитата: e1vin
Замучался я уже искать универсальное кроссбраузерное решение :( :confused:
Во-первых, можно ли заставить родительский контейнер "охватывать" дочерние со стилями "float: left" и "position: absolute"?
Во-вторых, каким образом, имея совокупность дочерних плавающих элементов внутри родительского контейнера, заставить их соответствовать по высоте родительскому и, соответственно, друг другу?
Первое со вторым уж вообще никак не хочет сочетаться :(
Если выставить min-height для родительского контейнера (чтобы он гарантированно включал в себя ребенка с "position: absolute" хотя бы фиксированной высоты), перестает работать 100% высота для других его дочерних элементов с "float: left"... Устал уже с этой ерундой воевать... :(
Во-первых, можно ли заставить родительский контейнер "охватывать" дочерние со стилями "float: left" и "position: absolute"?
Во-вторых, каким образом, имея совокупность дочерних плавающих элементов внутри родительского контейнера, заставить их соответствовать по высоте родительскому и, соответственно, друг другу?
Первое со вторым уж вообще никак не хочет сочетаться :(
Если выставить min-height для родительского контейнера (чтобы он гарантированно включал в себя ребенка с "position: absolute" хотя бы фиксированной высоты), перестает работать 100% высота для других его дочерних элементов с "float: left"... Устал уже с этой ерундой воевать... :(
Что то вроде этого:
Код:
???
Если мне ни с кем не изменяет склероз, то %% понимает только ИЕ. Нет?
Skywalker, спасибо, совершенно забыл про такое решение проблемы :) Вот только решения проблемы с аобсолютно позиционированными блоками этои способ не предусматривает... Ну да и бог с ними, спасибо :)
Цитата: Franky
Если мне ни с кем не изменяет склероз, то %% понимает только ИЕ. Нет?
Видимо, изменяет. Т.к. я не понял, о чем Вы, да и все прекрасно работает в IE6/7, FF (в опере и сафари тоже наверняка) :rolleyes: