在斯芬克斯——ie私有属性haslayout这篇文章中,我们提到的第一个斯芬克斯之迷,其实就是一个margin叠加问题。
关于margin collapsing,在W3C中是有明文规范的,符合其规则的都将产生margin collapsing。W3C认为margin叠加后的布局界面更良好。
margin叠加现象(父子级别):
可以看出wrap未被子层的margin所撑开。
但是,这种margin叠加往往不是我们所想要的效果(一些人甚至将此称为一个bug:margin叠加bug,也有称高度不适应bug的)——平心而论,我们努力的要避开margin collapsing多少也有些违背了W3C的初衷。不过,由于ie下经常有意无意的会触发haslayout,从而会避开margin叠加,这使得浏览器间显示不一。因此,我们还是有理由在适当时候彻底避开margin叠加的。
那么,如何避免这种margin叠加现象呢?
(全文…)