如何为表格单元格添加固定高度？

Question

我创建了一个我想在 jsfiddle 中使用的可滚动表格，但我无法让表格单元格具有固定高度或最大高度。 在查看我的示例时，您可能需要缩小浏览器宽度才能看到我在说什么：

https://jsfiddle.net/trleithoff/jz62aenk/5/

table, tr td {
    border: 1px solid black;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 30px;
    height: 30px;
}
tbody {
    display: block;
    height: 125px;
    overflow: auto;
}
thead, tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

在第一个表格单元格（第 1 行第 1 列）中有太多文本，省略号正在工作，但它是每行工作，而不是整个文本块。 有谁知道如何在表格单元格上强制固定高度？

Answer 1

表格单元格不适用于overflow: hidden 。 只需使用max-height和overflow: hidden将内容包装在 div 中的表格单元格中overflow: hidden

tbody tr td div{
  max-height: 30px;
  overflow: hidden;
}