HTML表格主体定位和滚动答案

【问题标题】：HTML Table Body Positioning and ScrollingHTML表格主体定位和滚动
【发布时间】：2011-11-28 02:48:41
【问题描述】：

如this Fiddle 中所示，我在一页上有三个表格。我希望能够滚动“排行榜”和“队列”的正文，只留下标题和表格标题。最好不要绝对定位。

~~有点相关，我还需要表格（不包括 caption 在侧面有一点填充（但不是在单个单元格之间）。~~

【问题讨论】：

【解决方案1】：

将overflow: auto; 添加到要滚动的周围DIV。您可能需要根据您的布局设置明确的高度——您不必这样做，但如果您不这样做，它就不会滚动。如果您希望它仅拉伸到一个点，您可以尝试设置 max-height。如果你只希望它垂直滚动，一些浏览器支持overflow-y: auto，但不是全部。

由于<caption> 在表格中，因此您无法在表格上设置填充或边距。您可以：

从表格中取出标题，使其成为像h2 这样的简单标题，然后在表格中添加边距，或者
您可以在左侧表格单元格/列上设置 padding-left，在另一侧设置 padding-right。不是很干净，但如果您愿意，可以让您保留 <caption> 语义。

【讨论】：

【解决方案2】：

将overflow: scroll; 添加到您的 div 中并包含height。如果您只想向一个方向滚动，您可以使用overflow-x 进行水平滚动，使用overflow-y 进行垂直滚动。要检测 div 是否需要滚动，请使用 overflow: auto;。

【讨论】：

是的，但是什么高度？如果我希望它是动态的，那么我不能只给它一个高度。
@CMC：你不必设置高度，但你不会得到滚动，它只会继续拉伸页面。也许你想设置一个最大高度？
您可以指定任何您想要的高度，并且 div 将是相同的高度，但 div 的内容是动态的。内容是需要滚动的原因，内容是动态的。
@Musafa 里面的内容是动态的，但是容器/表格的高度也是动态的。这意味着我不能为任何一个设置高度。
@CMC 因此，如果您希望容器与内容的高度相同，您要滚动什么？