如何调整div容器的大小以适应子div的溢出

Question

我有一个带有子div的div容器：

<div id=mainWrapper>
    <div id=child>
    </div>
<div>

 #mainwrapper height:100%, width:900px
 #child height:100%, width:50% overflow:visible float:right

子div包含元素列表。

如果孩子的溢出量大于mainWrapper的高度，如何调整mainWrapper的大小？

我尝试了一堆css和一些脚本：$（'＃mainWrapper'）。css（'height'，$（'＃child'）。height（））;

没有任何效果。

Answer 1

在#child结束后使用clearfix。需要清除浮动的div以将其父div拉到相同的高度。

 <div id=mainWrapper>
     <div id=child>
     </div>
     <div style='clear:both;'><!--clear--></div> 
  <div>

  #mainwrapper height:100%, width:900px  
  #child height:100%, width:50% overflow:visible float:right

参考： http://www.webtoolkit.info/css-clearfix.html

What methods of ‘clearfix’ can I use?

http://css-tricks.com/snippets/css/clear-fix/

Answer 2

在mainwrapper上设置overflow：auto：

#mainwrapper {
    width:900px
    overflow: auto;  
}

使用浮动时的hasLayout事物。

Answer 3

_{写作新答案，因为评论很容易被忽视。致Damien Overeem}

的积分

为了让孩子达到overflow:visible而mainwrapper调整到溢出的高度，请从孩子和height中删除mainwrapper属性。
在mainwrapper中，设置overflow: auto。