html - 是否可以将嵌套的 div 扩展到某个外部元素的确切位置？

Question

在我的页面上，我有一个网格(主要是 ExtJs)，它是由一堆嵌套的表格和 div 创建的。特别是最里面的 div(表示网格单元格内的一个元素)嵌套在另外两个表中(当然还有它们对应的 trs 和 tds)。

我希望这个最里面的 div 跨过表格边界扩展到下方单元格中相应 div 的底部(如附图所示)。有效地用完两个网格单元(或更多 - 3、4 等垂直方向)。

这可能吗？我不知道这样的方法(除了明确指定高度，这可能非常困难，因为它在单元格之间变化)，但我的 HTML/CSS 技能非常有限。如果可能的话，你能给我指明方向吗？

一些其他细节:

• 网格中的行可以具有可变高度，具体取决于其单元格中元素的大小
• 图中的黑线代表网格

Answer 1

如果你稍微玩一下，表格的内容可能会超出其边界

{position: relative;  
top: -40px}

对于表格中的div。尽管我会想到一个更优雅的解决方案。

检查这个 fiddle : http://jsfiddle.net/SkX7T/