如何使td / th标签固定宽度？

Question

我正在尝试为固定宽度的网站创建一个表，但是基于固定宽度td标记的固定宽度，而不是具有固定宽度的整个表。需要这是因为我使用jQuery动态显示和隐藏一些列，并使用jQuery滚动插件在表格变宽时滚动表格。我遇到的问题是，当td标签的宽度使表宽于其包含的div时，td标签开始收缩而不是保持其宽度。到目前为止，我所做的一切都没有让td标签保持正确的宽度。你可以在这里看到我正在处理的问题：

http://jsfiddle.net/MxE9A/1/

如何使td标签固定宽度，即使它们使表格比容器宽？

Answer 1

您可以使用css中的max-width和min-width来定义您希望td达到的最小和最大宽度。

Answer 2

哈哈，所以我从来没有这样做过，但这里有一个解决方案。添加以下内容：

tr {
    font-size: 0px;
    white-space: nowrap;
}
th, td {
    display: inline-block;
}

请注意，这只会兼容IE7 +，但您可以使用技巧使其正确显示为inline block in IE 7。

技巧是将它们设置为display: inline-block，以便它们在元素的末尾运行（使用white-space: nowrap）。

Answer 3

th {
  min-width:200px;
  max-width:200px
}

将此设置为固定宽度