我有两个包含动态内容的表格单元格。
表格单元格工作正常，当添加新内容使其大于表格单元格2时，表格单元格2的高度适合表格单元格1，并且所有内容都在宇宙中。
但是当新的内容被添加到表格单元格2（其中隐藏了溢出，并且与display：block一起正常工作）时，它会扩展，溢出永远不会发生，表格单元格1的高度现在与表格单元格2相匹配。
我想要的是当向表格单元格2添加更多内容时，它将向表格单元格1显示内容，然后隐藏其余内容。我知道我可以在javascript中做到这一点，任何想法如何在没有它的情况下做到这一点？
这是一个JSFiddle：http://jsfiddle.net/dYsNx/
Col 2只能在内容中达到col1的高度，其余应该是溢出隐藏的
答案 0 :(得分：1)
溢出：隐藏不应该以这种方式使用。 但是，你得到了这个概念。
其他人，我看到你的代码不是很干净而且保持标准。 所以，我会以我的方式修改它（希望它更好）
请参阅以下链接： http://jsfiddle.net/Edditoria/TGfzA/
如您所见，overflow: hidden;位于#box，然后设置position: relative;而不设置上/左设置。
为避免显示：IE＆lt; 7的表兼容性问题，请保留CSS中的默认div显示设置。我会使用％而不是固定的px宽度来避免IE的显示问题！
假设col1是动态高度的基础，则无需做任何事情。
在col2（以及所有其他列）中，您需要添加position: absolute; top: 0px; left: 50%;。
我将col-x从ID更改为class，因为您可能需要稍后添加更多列。
答案 1 :(得分：0)
通过纯CSS无法实现。这是来自CSS 2.1规范（http://www.w3.org/TR/CSS2/tables.html#height-layout）：
在CSS 2.1中，单元格框的高度是内容所需的最小高度。
一旦用户代理将行中的所有单元格都可用，就会计算'table-row'元素框的高度：是行的计算'height'的最大值，计算行中每个单元格的“高度”，以及单元格所需的最小高度（MIN）。