Как растянуть таблицу 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 не помогает.)

Ответы

Ответ 1

Просто используйте свойство height вместо свойства min-height при настройке #container. Когда данные становятся слишком большими, таблица будет автоматически расти.

Ответ 2

Попробуйте использовать это:

html, body    {
  height: 100%;
}

Таким образом, помимо высоты стола до 100%, вам также необходимо убедиться, что html'd и высота тела также 100%, поэтому он будет растягиваться должным образом.

Ответ 3

Вы можете справиться с этим в Javascript/JQuery.

window_height = $(window).height();
$('#container').css('min-height', window_height);