经常会遇到Firefox下 margin-top这失效的问题,但一直都是用变通的方式去解决,今天在网上查了查,有所收获,转帖备忘.
在这个说明中，“collapsing margins”（折叠margin）的意思是：2个或以上盒模型之间（关系可以是相邻或嵌套）相邻的margin属性（这之间不能有非空内容、padding区域、border边框或使用清除分离方法）结合表示为一个单独的margin。
在css2.1中，水平的margin不会被折叠。
垂直margin可能在一些盒模型中被折叠：
1、在常规文档流中，2个或以上的块级盒模型相邻的垂直margin会被折叠。
最终的margin值计算方法如下：
a、全部都为正值，取最大者；
b、不全是正值，则都取绝对值，然后用正值减去最大值；
c、没有正值，则都取绝对值，然后用0减去最大值。
注意：相邻的盒模型可能由DOM元素动态产生并没有相邻或继承关系。
2、相邻的和模型中，如果其中的一个是浮动的（floated），垂直margin不会被折叠，甚至一个浮动的盒模型和它的子元素之间也是这样。
3、设置了overflow属性的元素和它的子元素之间的margin不会被折叠（overflow取值为visible除外）。
