HTML中的可滚动嵌套表[重复]答案

【问题标题】：Scrollable nested table in HTML [duplicate]HTML中的可滚动嵌套表[重复]
【发布时间】：2014-03-19 13:19:09
【问题描述】：

在 HTML 中创建可滚动表格时遇到了一些麻烦。

从 Stackoverflow 中的一些类似问题，在 CSS 中使用 overflow: auto 是可行的，但我无法成功实施

有没有人可以帮忙检查一下我的代码有什么问题？

我想让左边的红色单元格只能滚动。

#samples {
    overflow: auto;
    height: 200px;
}

完整代码在：Jsfiddle

【问题讨论】：

标签： html css

【解决方案1】：

一种解决方案是将表格放在 div 中并使 div 可滚动？

看到这篇文章 -

希望这会有所帮助。

【讨论】：

【解决方案2】：

将以下 CSS 添加到 <table id="samples">

style="height:200px; overflow:auto;display:block;"

或者在 CSS 文件中

#samples {
   overflow: auto;
   height: 200px;
   display:block;
}

编辑

这可能不是你想听到的，但display: table-cell 不尊重宽度，会根据整个表格的宽度折叠。只需在您指定宽度的表格单元格内部添加一个 display: block 元素，您就可以轻松解决此问题

为了使元素居中，我对 CSS 做了一些改动。

【讨论】：