css浮动问题。

Question

<div style="width:100px; height:100px; float:left; border:solid 1px red;">div-1</div>b
<div style="width:100px; height:100px; border:solid 1px blue;">div-2</div>
像这样div-1应该是覆盖了div-2，但是div2里面的内容却显示在div-1的下面，而不是内容也被覆盖了，这是为什么？奇怪了。

Answer 1

<div style="......;background:#fff">div-1</div>

Answer 2

float:left的作用只是让div-1向左浮动，而还是占据了这个div块的位置，麻烦LZ清楚下float的意思，不是将div-2覆盖咯！这里div-1的属性里没有clear:right，同样占据的是整行的位置，div-2自然就会换行，显示到div-1的下方没什么奇怪的！

Answer 3

float:left  上面的回答貌似有点点问题取值：
none  :　 默认值。对象不飘浮 
left  :　 文本流向对象的右边 
right  :　 文本流向对象的左边 当float属性不为none时， display 属性等于 block 。也就是说，浮动对象的 display 属性将被忽略
跟随浮动对象的对象将移动到浮动对象的位置

Answer 4

在属性值设为 block 的对象后面添加新行。所以div2换行了，