可以溢出:隐藏影响布局?

Yar*_*rin 11 html css layout overflow

除了在JS Fiddle上引用以下示例之外,我无法解释这一点- 在我引入overflow:hidden属性之后,最后一个BLUE框没有按预期扩展到100%的宽度.

我的印象是溢出:隐藏只会影响可见性方面,而不会干扰布局.有人可以解释这个例子中发生了什么吗?

编辑: 此问题似乎仅限于webkit浏览器(例如Chrome)

kap*_*apa 16

这是因为overflow: hidden,除了其他属性之外,还引入了一个新的块格式化上下文.

你可以在这篇伟大的文章中阅读有关效果的内容: 溢出的魔力:隐藏

更新:我已经将你的jsFiddle重写为有效的东西(在Chrome上测试过).取而代之的定义margin-left#red#blue(这将不同的作用,由于overflow: hidden),我已经把margin-right#yellow.