这个HTML代码有什么问题？

Question

<div style="float: left">text1</div> 
<div style="float: right;">text2</div>
<div class="random_class">text3</div>

这是问题所在。 Random_class在text1和text2上位于顶部。 怎么了？ 谢谢。

Answer 1

你需要清除浮动，下面是一个例子。

<div class="random_class" style="clear:both">text3</div>

你也可以这样做

.random_class {
    clear: both
}

Answer 2

干得好：

http://jsfiddle.net/q4CqZ/3/

添加clear:both; 到.random_class

Answer 3

无论何时浮动元素，它都会将其从内容流中移除。

Text1和Text2是浮动的，因此Text3的行为就像它在那里看不到它一样。 浮子知道其他浮子。 使用clear:both; 告诉CSS，它的左侧或右侧不应该是任何东西。