Есть простая страница - колонка посередине, слева background div, справа backround div (оба на всю вышину). То есть макет элементарнейший.
Условия:
1) doctype transitional (с ссылкой на документацию)
2) кроссбраузерность.
на все таги вешаем как положено height:100%, на html,body и контентные.
Теперь траблы:
или надо выкидывать doctype или IE.
Собственно, что таблица, что div-ы с height:100% ведут себя точно также, разницы нет в чем верстать. Забудем по причине работоспособности о других браузерах кроме ИЕ.
Все вытягивается нормально до момента когда длинна контента не превышает вышины ока браузера. Как только появляется scroll, то вышина diva остается равной вышине окна а не реальной страницы. (Нафига нужен height 100% если это height окна а не документа??)
код:
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/2000/REC-xhtml1-200000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>proba</title>
<style>
html,body {height:100%; width:100%;}
body {margin:0; padding:0;}
#allpage {width:100%; height:100%; border:0;}
#left,#content,#right {float:left; height:100%; border:3px solid #ff0000;}
</style>
</head>
<body>
<div id="allpage">
<div id="left">aaa</div>
<div id="content">bbb</div>
<div id="right">ccc</div>
</div>
</body>
</html>
все прекрасно пока в id="content" не сунете для IE 100 раз bbb<br>bbb<br>
с таблцей аналогично:
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/2000/REC-xhtml1-200000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>proba</title>
</head>
<body style="height:100%; margin:0; padding:0;">
<table border="1" style="height:100%"><tr>
<td style="height:100%">
<table border="1" style="height:100%">
<tr><td>asdasd1</td></tr>
<tr><td>asdasd2</td></tr>
</table>
</td>
<td style="height:100%">sdsdsd<br>sdsdsd<br>... povtorite 100 raz...</td>
</tr>
</table>
</body>
описание стилем или height="100" неважно ибо за пределами обуждения спецификации doctype.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
решает проблему, на как сказал это невыполнение условия, и нет линка на документацию спецификации.
всякие fixed + absolute тут не причем и проблемы не решат.
Какие нить идеи? У меня башка кипит, это же простейший макет самого распостраненного дизайна.