大家好
最近处理一个 CSS 跑版问题很疑惑
就是如果 float 配上 overflow 时，不同浏览器行为会不一样
例如这份程式
http://goo.gl/MsztHN
在 chrome 显示是
http://i.imgur.com/rplLNL3.png
在 firefox 显示是
http://i.imgur.com/5zBF3T5.png
明显不一样..
overflow 不是只是设定有没有 scroll bar 吗?
如果只是设定 scroll bar
应该会出现下面这种结果
http://i.imgur.com/CFGsly3.png
可是 chrome 与 fixfox 都不是这种结果
怎么会有其他的行为出现?
是有什么是我没注意到的? 还是这种写法不符合正统作法?
另外一个问题
我发现如果我有设定 display: none ，那么同一个元素设定的 clear 属性就会无效...
是 display: none 会让其他属性无效吗?

有时候css并不是总是可以很有逻辑的解释,有时单纯就只是经验还有trick,像position:absolute;top:0;bottom:0既然render出来不一样,就用其他种方式去写

i大你的例子在逻辑上就是矛盾的，我的overflow在逻辑上是矛盾的吗? 我想可能有，但我看不出来。

Overflow 会产生新的 block formatting contexthttp://goo.gl/XtCR3z大概两个浏览器的新 bfc 跟 float 元素互动的方式不同...另，box2挂clear:left以后就相同了。但应该不是你要的...

overflow不是只有关于卷轴，他会修改box Mode...

BFC没听过,学习了,我刚那写法是让一个元素高度撑开跟母元素一样,有时有些特别组合height=100%没作用,那写法却有作用,行为也有点不一样,不好解释的都叫trick xd

感谢G大，以前不知道BFC这东西。另外我的CSS知识是从 http://goo.gl/dKJjk1 来的对于 CSS 那网站会说明得太少吗? 例如 BFC 就没有提

你要找细节就去找高手的blog或是大社群维护的像css-tricks或是mdn那种,工具只是达到目的的方式