Если задать doctype, Explorer иначе высчитывает высоту TD

Flex25 · January 13, 2011

Нужно сделать таблицу на всю ширину и высоту окна, причем одна из ячеек так же должна иметь высоту 100%. Я написал нижеследующий код. Если НЕ задать doctype, код во всех браузерах работает корректно, если задать - Explorer начинает растягивать таблицу по высоте так, что появляется вертикальная прокрутка.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<HTML>
<HEAD>
  <STYLE>
	HTML, BODY {height:100%; margin:0px;}
  </STYLE>
</HEAD>
<BODY>

  <TABLE cellSpacing=0 cellPadding=0 width=100% height=100%>
  <TR><TD>Ячейка 1</TD></TR>
  <TR><TD>Ячейка 2</TD></TR>
  <TR><TD>Ячейка 3</TD></TR>
  <TR><TD style="height:100%; background:#CCCCCC;">Ячейка 4</TD></TR>
  </TABLE>

</BODY>
</HTML>

Суть проблемы: если в Explorer ячейке в таблице задать height=100%, то ячейка растянется на 100% ОКНА браузера, а не своего КОНТЕЙНЕРА, как в других браузерах.

Что сделать, чтобы Explorer растягивал в высоту ячейку по контейнеру, а не окну?

Очень надеюсь на вашу помощь, заранее спасибо! Прошу верстку div'ми не предлагать, т.к. на данный момент передо мной стоит такая специфичная задача, которую нужно решить именно таблицами.

psywalker · January 13, 2011

Была уже на форуме такая задача, бились мы бились, так и не справились. Один модер писал экспрешан, но в итоге оказалось, что и он вешал браузер. Так что тут выход наверное один, какой нибудь такой

<!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="ru">
<head>

	<title></title>



  <STYLE>
  * { margin: 0; padding: 0;}
	html,body{height:100%; margin:0px;}
	table { border-collapse: collapse; height: 100%;}
  </STYLE>
</HEAD>
<BODY>

  <table>
  <tr><td style="height: 6%;">Ячейка 1</td</tr>
  <tr><td style="height: 6%;">Ячейка 2</td></tr>
  <tr><td style="height: 6%;">Ячейка 3</td></tr>
  <tr><td style="height:82%; background:#CCCCCC;">Ячейка 4</td></tr>
  </table>

</BODY>
</HTML>

Flex25 · January 14, 2011

Потяно. Спасибо, но ваше решение все же не выход...

Я тоже вчера целый день мучился, так ничего и не придумал.

Меня больше всего бесит то, что во всех статьях написано о важности doctype, т.к. якобы при указанном doctype во всех браузерах код отображается одинаково, но в то же самое время на деле код отображается все равно по разному. Так и хочется засунуть все эти doctype w3-консорциуму и разработчикам браузеров в задницы.

psywalker · January 14, 2011

Так и хочется засунуть все эти doctype w3-консорциуму и разработчикам браузеров в задницы.

Лучше ИЕ-шникам засунь)

Sign In

Если задать doctype, Explorer иначе высчитывает высоту TD

Question

Flex25

Link to comment

Share on other sites

3 answers to this question

Recommended Posts

psywalker

Link to comment

Share on other sites

Flex25

Link to comment

Share on other sites

psywalker

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information