CSS3显示：表格，溢出-y：滚动不'；行不通

我有一个需要垂直滚动的数据表。如果显示值为table，则无法设置高度或最大高度，因此overflow-y:scroll不执行任何操作。 （）

此外，如果从父级中删除display:table，但保留display:table行和表单元格，则行的宽度不会为100%

我尝试使用flexbox（）来执行此操作。但当然，我没有左对齐的好列

.fake-table > * {
  display: flex;
  justify-content: space-around;
}

---

浏览器支持所有现代浏览器（IE10+），包括移动safari和android浏览器。

将您的

.fake table

包装在

div

中

此外，使用实际的

来显示表格数据也是100%可以接受的。。。事实上，这是首选。当事情变得复杂时，它使用表格进行布局

• 如果显示值为table，则无法设置

  高度

  或

  最大高度

  实际上，规范说（）：
  在CSS 2.1中，“最小高度”和“最大高度”对表格的影响， 未定义内联表、表单元格、表行和行组
  您可以使用

  height

  属性，但它将被视为最小高度，因此不会产生溢出（）：
  表的高度由表的“height”属性给出 “table”或“inline table”元素。值“auto”表示 高度是行高度加上任何单元格间距或边框的总和。 任何其他值都被视为最小高度

• 此外，如果从父级中删除

  显示：表格

  ，但保留

  显示：表格行

  和

  表格单元格

  ，则行的宽度不会为100%
  在本例中，由于没有表格容器，因此会生成一个匿名容器（）：
  HTML以外的文档语言可能不包含中的所有元素 CSS 2.1表格模型。在这些情况下，“缺失”元素必须 为使表格模型正常工作，必须假定。任意表元素 将自动生成周围必需的匿名表对象 本身
  但那个匿名表不一定像

  .fake table

  那么宽

• 我试着用flexbox来代替它
  Flexbox是一个糟糕的选择，因为它没有网格概念
  也许会更好，但它目前是实验性的，只有IE10支持它（规范的旧版本，很难）

基本上，您有两种选择：

• 固定列宽法
  如果预定义列的宽度，即使不使用表格/栅格显示，结果也将是栅格

• 非表格到包装器
  您可以将表格包装在虚拟（非表格）元素中，并将

  溢出

  和

  最大高度

  设置为该元素

---

你能用

最大高度
和
溢出-y
设置将你的
假表
包装成
div
吗？请参见此图。是否希望表标题保持静态？因为这里有一个答案：这个页面有两个由CSS控制的布局。一种是“平铺”布局，另一种是“表格”布局，因此两种布局都需要使用相同的html。我认为将
表格
包装在
div
中，并给出
最大高度
是最好的解决方案，因为只有IE才支持网格布局。
.fake-table > * {
  display: flex;
  justify-content: space-around;
}