如何将HTML表格拉伸到浏览器窗口高度的100%？

Question

我正在使用表格设计我的网页布局。即使表格内容很少，我也希望它能填满页面。以下是我使用的 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中没有帮助。）

- Mikhail

Answer 1

试一下这个：

html, body    {
  height: 100%;
}

除了将表格的高度设为100%之外，您还需要确保html和body的高度也为100%，这样它才能正确地延伸。

- deathlock

Answer 2

只需使用 height 属性而不是 min-height 属性来设置 #container。一旦数据过大，表格将自动增长。

- Vincent

Answer 3

你可以用Javascript/JQuery来处理这个。

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

- Priyanga