html - 使 div 自动调整大小以适应其容器高度

Question

我有一个这样的 HTML：

<div class="container">
    <div class="banner"></div>
    <div class="left"></div>
    <div class="right">
        <div class="content"></div>
    </div>
</div>

这些divs 会根据其内容自动调整大小overflow: auto。现在我面临一个问题。当div:content溢出其父级时，div: right将div: container调整大小以适应div:content高度。但div: left高度保持不变。如何在高度变化时div: left自动调整高度以适应div: container高度？

这里是一个jsfiddle：http: //jsfiddle.net/trongcuong1710/cDqSj/2/

Answer 1

你可以试试这个：

.left {
    width: 200px;
    overflow: auto;
    background-color: blue;
    position:absolute;
    top:140px;
    left:0;
    bottom:0;
}

.right {
    width: 300px;
    min-height: 260px;
    overflow: auto;
    background-color: green;
    margin-left:200px;
}

示范

希望我能正确理解这个问题 - 如果您尝试更改内容高度，现在可以正常工作。