html - 表格单元格属性忽略宽度

Question

我为一个 div 设置了一个 CSS 属性 table-cell。我还指定了 div 的宽度并设置溢出隐藏，但由于 table-cell 属性，div 不关心宽度。如果我放置任何大图像，它就会超出宽度。如何使用表格单元格并为 div 使用固定宽度？

.right{
    display: table-cell;
    overflow: hidden !important;
    vertical-align: top;
    width: 400px;
}

Answer 1

奇怪，this JSFiddle似乎对我有用。

您在哪个浏览器中遇到问题？

此外，要强制表格单元格的最大宽度，请使用 max-width 属性。你可以see it here , 代码如下。

HTML:

<div class='table'>
  <div class='tr'>
    <div class='right'>hey</div>
  </div>
</div>​

CSS:

.table {
    display: table;
}
.tr {
    display: table-row;
}
.right{
    display: table-cell;
    overflow: hidden !important;
    vertical-align: top;
    max-width: 400px;
    outline: 1px solid #888;
}​