如何将HTML表格宽度限制为屏幕宽度的95％？

Question

如何将HTML表格宽度限制为屏幕宽度的95％？

我正在使用

<style type="text/css">
table {
  max-width:95%;
  border-collapse:collapse;
  ...
}
...

但生成的HTML页面的表格宽度大于屏幕宽度（1440x900屏幕），并且页面底部会显示滚动条。

Answer 1

max-width无法应用于表格标签。请改用宽度。

<table>
<tr>
    <td>test</td>
</tr>
</table>​

table {
  width:95%;
  border-collapse:collapse;
}

td {background:red;}

http://jsfiddle.net/2wH8S/

有应用最大宽度效果的解决方法，在“css table max-width”上执行google。

Answer 2

使用样式

width: 95%;

代替。此外，根据您的意图，请考虑样式

width: 100%;
margin-left: 10px;
margin-right: 10px;

更好的布局。我只是在这里猜测，但是让桌子和窗口边缘之间的距离固定是一个好主意。否则，在调整大小时，会动态更改边距。

Answer 3

添加到Konrad Viltersten，我会将宽度设置为95％，但不使用10px的左右边距，我会使用：

margin-left: 2.5%;
margin-right: 2.5%;

这可以消除调整浏览器窗口大小时的任何定位问题。