在css的包装器中使用2列的动态高度答案

【问题标题】：Dynamic height using 2 columns in a wrapper in css在css的包装器中使用2列的动态高度
【发布时间】：2013-05-29 23:19:19
【问题描述】：

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

谢谢

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;
}

【问题讨论】：

标签： html css height multiple-columns

【解决方案1】：

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

#wrap{
   overflow: hidden;
}

#inner-left{
    float:left;
}

#inner-right{
    float:right;
}

【讨论】：