外边距合并的问题和解决方法

外边距合并问题，即margin塌陷现象。

一、父子级

现象：

解决方法：
1、给父级元素添加边框属性
2、给父级元素添加padding
3、给父级元素添加overflow：hidden；
4、给子级或父级一方添加浮动
5、给子级或父级一方添加绝对定位
6、给子级或父级一方添加display：inline-block；

二、兄弟级

1、垂直方向上，外边距如果都是正数，则不会叠加而是会取最大的值。
如：一个为margin：10px，一个为margin：20px，则最后两者之间的外边距为20px

2、垂直方向上，外边距如果有一个为负数，则会进行叠加。
如：一个为-10px，一个为20px，则最后两者之间的外边距为10px；

3、垂直方向上，外边距如果都是负数，则不会叠加而是会取绝对值较大的值。如：一个为-10px，一个为-20px，最后两者之间的外边距为-20px；