html - 自动将一个 div 调整为另一个 div

Question

我有 2 个并排的 div。

左 div 有不同的高度，如何让右 div 自动调整为左 div 的大小？如果右 div 的内容大于左 div，则应该添加一个滚动条。

的HTML

<div class="wrapper">
    <div class="left"><!-- PHP Generated Content --></div>
    <div class="right"><!-- PHP Generated Content --></div>
</div>

CSS

.left{
    width: 70%;
    float: left;
}
.right{
    width: 29%;
    float: right;
    border: solid 1px #000000;
    height: 100%;
    min-height: 200px;
    overflow: auto;
}
.wrapper{
    height: auto;
    float: left;
    border: solid 1px red;
}

http://jsfiddle.net/userdude/MJrS9/

Answer 1

如果不为父“.wrapper”提供预定义的高度，就无法（我可以看到）检测针对“.left”设置的高度并将其应用于“.right”。即使将右 div 的高度设置为“继承”，也只会获取无论如何动态调整的高度。也许有人可以建议使用 javascript 的解决方案。

Answer 2

简单的等高列：

.left{
    width: 70%;
    display: table-cell;
}
.right{
    width: 29%;
    border: solid 1px #000000;
    display: table-cell;
}
.wrapper{
    display: table;
    border: solid 1px red;
    width: 100%;
}

http://jsfiddle.net/g5mvs/