Вертикальное 100% у таблицы в XHTML

AntonK · January 10, 2008

Народ всем привет, думаю что многие сталкивались с такой проблемой, я кстати тоже давно и вот столкнувшись с ней вновь опять впал в стопор.

Скрины:

IE

OPERA

Суть проблемы следующая, мне нужно написать код на XHTML версии STRICT то есть када код и стили полностью отделены друг от друга.

Нужно получить результат как на втором скрине(это ОПЕРА). Первый скрин это ИЕ(в нем некорректно работает)

CSS:

html, body {height: 100%; padding: 0px; margin: 0px;}

.main_table {height: 100%;}

.top {height: 200px;}
.content {}
.bottom {height: 50px;}

HTML:

:

<!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">
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="style2.css" />
</head>

<body>

<table class="main_table" width="100%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td class="top">top</td>
</tr>
<tr>
<td class="content">content</td>
</tr>
<tr>
<td class="bottom">bottom</td>
</tr>
</table>

</body>
</html>

Идея такова, есть шапка, высота которой фиксированная 200px есть подвал, высота его 50px, и есть контентная часть, ее высоту мы никогда не знаем так как собственно она должна тянуться под контент. Опера справляется с задачей на ура, см. скрины. Но вот ИЕ глючит с высотой и по страшному. Подскажите плз как выйти из воды сухим в данном случае.

PS: варианты перехода на HTML не предлагать

Иван Шумов · January 10, 2008

задай для контента height: 100%; и не парься

Scrum · January 10, 2008

PS: варианты перехода на HTML не предлагать

Дивы могу предложить. Икать по слову footer.

AntonK · January 10, 2008

задай для контента height: 100%; и не парься

тогда появляется полоса прокрутки что тоже плохо, когда задаешь контенту 100% он считает точкой отсчета не верх окна браузера,а низ предыдущей ячейки и в итоге появляется место лишнее равное 200px то есть из за Top

Dimitry Wolotko · January 10, 2008

Перемещено в раздел: "Проблемы с версткой"

Sign In

Вертикальное 100% у таблицы в XHTML

Question

AntonK

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

Иван Шумов

Link to comment

Share on other sites

Scrum

Link to comment

Share on other sites

AntonK

Link to comment

Share on other sites

Dimitry Wolotko

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information