垂直外边距合并问题

简单地说，外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。实际工作中，垂直外边距合并问题常见于第一个子元素的margin-top会顶开父元素与父元素相邻元素的间距，而且只在标准浏览器下(FirfFox、Chrome、Opera、Sarfi)产生问题，IE下反而表现良好。

解决外边距合并的方法：

1.当发生外边距合并的两个元素为父子关系时，给父元素添加border或者设置overflow:hidden都可解决合并问题。

2.当发生外边距合并的两个元素为兄弟关系时，给元素设置浮动float或者position:absolute都可解决合并问题。