Question

我有两个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

简易高度柱：

.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/

Answer 2

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

自动将一个div重新调整为另一个div

2 个答案: