Как растянуть HTML-таблицу до 100% высоты окна браузера?
Я использую таблицу для разработки макета своей веб-страницы. Я хочу, чтобы таблица заполняла страницу, даже если она не содержит большого количества контента. Вот CSS, который я использую:
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#container {
min-height: 100%;
width: 100%;
}
И я помещаю что-то вроде этого в код страницы:
<table id = "container">
<tr>
<td>
...
Это работает для Opera 9, но не для Firefox 2 или Internet Explorer 7. Есть ли простой способ заставить это решение работать для всех популярных браузеров?
(Добавление id = "container" в td не помогает.)
Ответы 3
Просто используйте свойство height вместо свойства min-height при установке #container. Как только данные становятся слишком большими, таблица автоматически увеличивается.
Попробуйте использовать это:
html, body {
height: 100%;
}
Таким образом, помимо установки высоты таблицы на 100%, вы также должны убедиться, что высота html'd и body также равна 100%, чтобы она растянулась должным образом.
Вы можете справиться с этим в Javascript / JQuery.
window_height = $(window).height();
$('#container').css('min-height', window_height);