html - 在 css 的包装器中使用 2 列的动态高度

Question

我有以下 html 布局，根据我所在的页面，左内 div 或右内 div 可能有更多内容。我如何构建 css 代码，使包装 div 的高度等于任一内部 div 中较大的一个？我当前的代码仅根据左列展开外部 div，但如果右列包含更多内容，则无法正常工作。我在左栏上使用了最小高度，但效果不是很好。任何指导将不胜感激。谢谢!

谢谢

HTML: `

<div id="wrap">

    <div id="inner-left">
        content left
    </div>

    <div id="inner-right">
         content right
    </div>

</div>

CSS:

#wrap{
height: 100%;
overflow: auto;
position: relative;
}

#inner-left{
    overflow: auto;
}

#inner-right{
    position:absolute;margin-left:640px;
}

Answer 1

将 overflow:hidden 设置为父项应该使其尝试包装您的内容。试试这个:

#wrap{
   overflow: hidden;
}

#inner-left{
    float:left;
}

#inner-right{
    float:right;
}