主体内容里的白块和绿块不能并排显示是因为宽度？

设置了浮动后课程里面说是因为装不下这两个元素所以没有并排，但这两个元素的宽度加起来不是少过父元素的宽度吗？

慕的地6863477

2016-11-01

源自：网页布局基础 3-3

关注问题我要回答

604

操作

收起

3 回答

栀子_
2016-11-02

我正好也有这个疑问，楼上说的有理，因为块级元素独占一行，所以两个都要设置成浮动

0 回复有任何疑惑可以回复我~

收起回答

徐锦杰
2016-11-02

当时设置了白块浮动，绿块还是div是块元素，块级元素在浏览器显示时，通常会以新行来开始（和结束），所以绿块会在下面显示。

之后绿块设置了浮动，父元素受到浮动影响无法扩展开，所以不显示黄色块。

0 回复有任何疑惑可以回复我~

收起回答

栀子_

可是为什么绿色的块设置浮动后，紫色的块自己跑上来了呢？紫色的块也是块级元素，不是应该独占一行在下面吗

2016-11-02 回复有任何疑惑可以回复我~

慕的地6863477 提问者

但是在上一章 “清楚浮动影响”里面同样两个<div>会受到浮动的影响排成一列？

2016-11-02 回复有任何疑惑可以回复我~

徐锦杰回复栀子_

mainboby首先是没有设置高度的，在left和right设置浮动后，left和right脱离了文档流，那么mainbody的高度不会因为子元素而扩展，高度就为0，紫块作为独占一行显示，也就是挨着头部了。而在mainbody里添加overflow:hidden，会让浮动元素又回到文档流，并且暂居一定的空间，那么mainbody的高度又被子元素撑开了，紫块就又下去了。（个人理解）

2016-11-02 回复有任何疑惑可以回复我~