CSS：外边距合并问题要点

使用margin定义块元素的垂直外边距时可能会出现外边距的合并

1、相邻块元素垂直外边距的合并

（1）、当上下相邻的两个元素相遇时，如果上面的元素有下外边距（margin-bottom）

（2）、当下面的元素有上外边距（margin-top）,则他们之间的垂直间距不是margin-bottom和margin-top之和

（3）、取两个值中较大者这种现象被称之为相邻块元素垂直外边距的合并（也称为外边距塌陷）

2、嵌套块元素垂直外边距的合并（塌陷）

（1）、对于两个嵌套关系的块元素，如果父元素没有上内边距及边框

（2）、父元素的上外边距会与子元素的上外边距发生合并

（3）、合并后的外边距为两者中的较大者

解决方案：

（1）、可以为父元素定义上边框（border-top:1px solid transparent）

（2）、可以为父元素定义上内边距（padding-top:1px）

（3）、可以为父元素添加overflow:hidden;

还有其他方法，比如浮动、固定、绝对定位的盒子不会有问题。