关于DIV float display 的奇怪问题

[czjczj20]

<div style="display:block;">
<div style="float:left"><button style="width:200px;">1</button></div>
<div style="float:left"><button style="width:200px;">2</button></div>
<div style="float:right"><button style="width:200px;">3</button></div>
</div>

<div style="display:block;">123</div>
<div>1234</div>

代码和显示效果请见图片，123那个div回和上面的button所在的div重合，不知道为什呢，button所在的那个DIV我显式的声明了display为block，为什么这一排按钮还不能独占一行呢？我用的是IE8 和IE12，不知道div本身有什么神奇的属性，或者button外围的div的float有什么神奇的效果？

大神们，，求助。。。

[MnZlZ]

position:static　　　默认值。没有定位，元素出现在正常的流中 　　　　　　　　　　　（不定义时，就是此默认值） 如果父窗口是直接的body，也没有任何相对位置，这样其下的div都是相对屏幕的左上角的位置。 <div style="display:block;"> //省略掉 </div> <div style="display:block;">123</div> <div>1234</div> 因为定义的两个div都是相对于body的默认static定位，第一个div确定位置后并不会影响到第二个div，第二个div任然显示在正常流中，出现重合

[斜杠代码日记]

楼上正解。 楼主定义的三个包含button的div都设置了float，那浏览器会把这三个div从正常流中拿走。然后浏览器检测到下面的<div>123</div>，于是浏览器把该div添加到上一个div下方。 建议楼主设置一下div的边框和margin来仔细观察。

[ht_917163972]

div本身就是display:block;的，楼主为何多此一举再写内联。。。。

[KK3K2005]

搜索关键字 清浮动

[a88532698]

里边全是float元素的盒子要加上overflow:hidden才会有高度