<div>中的表格溢出问题

Question

我有一个非常基础的 CSS 问题。 我有一个固定高度的 div，里面有一个表格。

除非 div 获得滚动条，否则表格的内容将无法适应 div。问题是，现在表格的内容正在溢出 div，因为其高度大于我设置的 div 高度。

这是我对 Div 的设置：

 display: inline-block;
    float: left;
    max-height: 200px;

这里有一个例子。

jsfiddle

我该如何让表格适应 div 并添加滚动条？这不是针对特定浏览器的。我已经在 Chrome 和 IE 上尝试过了。

- Krishna Veeramachaneni

Answer 1

[编辑] 引用您的请求：

如何使表格适应 div 并具有滚动条。

将以下内容添加到 .test 中（演示）

overflow-y:scroll;

Documentation for overflow-y

- canon

Answer 2

.test {
  background-color: gray;
  display: inline-block;
  float: left;
  max-height: 200px;
  overflow-y: scroll;
}
.matrix td, .matrix th{
  border: 0.1em solid #E2E2E2;
  padding: 4px 2px;
  min-width: 65px;
  white-space: normal;
  text-align: center;
}

- Garry

---

修改以包含我的答案？这样做不好，先生。 - canon

我刚刚明白他想要滚动条，一开始我以为他不想要。对于我的匹配错误，我很抱歉，我会给你+1的同样答案。 - Garry