列忽略其父母的身高

Question

问题是父母div应该尊重两列（#col1和#col2，均使用float:left）的文字height。然而，父母的身高属性（#content）的行为就像写在里面没有文字。

代码：http://jsfiddle.net/Arkl1te/UWNaT/

我可以插入一个固定的高度，但它不应该这样的工作：高度应该有一个“灵活”的价值，甚至文本。

Answer 1

随着孩子们浮动，你有两个选择：

添加overflow: hidden;父尊重儿童的身高：

#content{ 
    overflow: hidden; 
} 

添加一个空元素与clear:both的最新元素：

<div id="content"> 
<p id="col1">...</p> 
<p id="col2">...</p> 
<div style="clear:both;"></div> 
</div>