CSS，儿童的div和浮动

Question

我已经厌倦了这些类型的div :(工作

我有2周的div：

<div id="content"> 
    <div id="row_left"></div> 
    <div id="row_middle"></div> 
    <div id="row_right"></div> 
</div> 
<div id="bottom"></div> 

CSS：

#content { 
    overflow: hidden; width: 100%; 
} 

内容-div包括另外3个div，应该保持水平。

#row_left, #row_middle, #row_rifht { float: left; width: 33%; } 

麻烦的是底部div不保留指内容文本。它始终处于相同的位置，即使内容行文本结束。我该如何修复它？

Answer 1

尝试增加与风格的内容后一个div：

clear: both; line-height: 0.1em; 

，把一个

 

它

Answer 2

尝试

... 
<div id="bottom" style='clear:both'></div> 

Answer 3

如果您想在不增加外露的情况下清除漂浮物一个标记，把这个在你的CSS：

#content { zoom: 1; } 
#content:after { 
    clear: both; 
    display: block; 
    content: "."; 
    height: 0; 
    visibility: hidden; 
}