如何根据其他div元素自动设置一个div的高度？

Question

我有以下代码：

<div class='parent'>
    <div class='left-child"'></div>
    <div class="right-child"></div>
</div>

我想做的是，如果“左子”的高度增加，那么“右子”的高度也会增加。

这可能是一个简单的问题，因为我对html和css的了解较少。

我不想使用任何java脚本代码。 我只想要css和html代码。

感谢。

Answer 1

看看：

Demo

Answer 2

最常见的跨浏览器解决方案是使用表格属性设置div的样式。这也是最不语义的解决方案。

.parent{
     display:table;   
}
.parent > div {
     display:table-cell;
}

DEMO

Answer 3

您可以通过将要在右栏中使用的背景添加到.parent来创建具有相同高度的左右儿童的幻觉。我添加了一个例子：

http://jsfiddle.net/3MCzm/