6

在我们的设计中，我们最终需要多列来显示带有省略号的标题，我不认为这有什么大不了的，但是当它们嵌套在 adisplay: table中时，计算似乎是不正确的。

需要注意的是，我们需要响应式布局，因此需要百分比宽度（固定宽度可以解决问题）。而且我们的布局确实需要display: table更进一步的树，如果不进行重大重构，我无法删除它。

如果您删除显示器，一切都会按我的预期工作：

预期的

但是具有该显示会导致父级考虑预先截断的子元素总宽度（但考虑到 nowrap）。就好像初始渲染发生时没有定义溢出并在事后添加它（但到那时宽度计算太大了）。

结果

我可以猜测为什么渲染会中断，但我想要一个关于浏览器如何渲染这个的更明确的答案......（在 Mac 上的 Chrome/FF/Safari 中测试）

4

1 回答 1

2

原因与使用auto布局方法时表格布局单元格的方式有关。

其工作原理的细节在 CSS 规范的第 17 节中进行了解释，但关键是auto布局取决于单元格的内容（这就是为什么当您将内容强制放在一行时它会如此之大），而fixed布局仅取决于表格宽度（这是您所期望的）。

如果您只是添加table-layout:fixed到您的 .table 选择器，您的问题应该得到解决。

于 2013-05-07T01:28:39.280 回答