仅展开一个表格单元格

我有两个表格单元格，包含动态内容。仅展开一个表格单元格

表小区中的一个正常工作，当新的内容被添加到它使它大于表格单元2，表格单元格2的身高适合表格单元格1的，一切都很好在宇宙中。

但是，当新的内容被添加到表格单元2（已溢出隐藏，并且工作正常显示：块）它扩大，溢出不会发生，并且表格单元格1的高度，现在匹配的表格单元格2.

我想要的是，当更多的内容被添加到表格单元格2时，它将显示内容直到表格单元格1，然后隐藏其余内容。我知道我可以在JavaScript中做到这一点，任何想法如何没有它呢？

这里有一个的jsfiddle：http://jsfiddle.net/dYsNx/

西2只上升到COL1的高度内容，其余均应溢出隐藏

来源

2012-06-09 Air In

您是否让单元格2为固定宽度？除非您修复它们的大小，否则表格单元格自然会增长以适合其内容。 –

你能展示一些代码吗？还是JSFiddle？我的意思是，我无法正确理解你的问题。你想要一个'colspan'还是'rowspan'？ –

这里你去：http://jsfiddle.net/dYsNx/ - 第2列应该只上去col1的高度的内容，其余的应该是溢出隐藏 –

溢出：隐藏不应该以这种方式来使用。但是，你明白了。

其他人，我看到你的代码是不是很干净，并保持标准。所以，我将修改它在我的方式（希望是更好）

请参阅以下链接：在#box http://jsfiddle.net/Edditoria/TGfzA/

正如你看到的，overflow: hidden;是，然后设置position: relative;没有顶部/左设置。

为了避免显示：IE < 7的兼容性表问题，请只是保持默认的div显示设置在CSS。我会使用％而不是固定的px宽度来避免IE的显示问题！

假定COL1是动态的，高度的基础上，还有什么可以做。

在col2（和所有其他列）中，您将需要添加position: absolute; top: 0px; left: 50%;。

我从ID更改COL-X上课了，因为你可能需要在以后添加更多的列。

更新：基于您的评论，增加了滚动而不是隐藏额外的信息。

来源

2012-06-09 10:48:14 Edditoria

对不起，关于代码，我只是从头开始写在JSFiddle W/O代码提示和所有其他光荣的东西，因为我的代码复制和粘贴（但标准兼容;））有点复杂。 - 这将是完美的，除了我忘记提到溢出应该显示一个y滚动条，如：overflow-y：scroll; - 但是当我应用它时，滚动条会被切断。 - 我想我只是将第二列保持为固定高度的内联块，似乎不太成问题。 –

大声笑，我没有提示写乱码。我的英语不好。我试图弄明白。请您点击链接再次查看？ y滚动条仅在需要时显示（自动），而不是隐藏超出高度的额外信息。您只需添加'height：100％;' – Edditoria

谢谢，完美！ –

它通过纯CSS的方式是不可能的。这是来自CSS 2.1规范（http://www.w3.org/TR/CSS2/tables.html#height-layout）：

在CSS 2.1中，单元格框的高度是内容所需的最小高度。

元件的盒子一旦用户代理计算出的“表列”的高度具有与行中的所有单元提供：它是最大行的计算“高度”，计算“高度的'的行中的每个单元格，以及单元格所需的最小高度（MIN）。

来源

2012-06-09 11:05:06 user907860

仅展开一个表格单元格

回答

相关问题