css外边距问题

1、外边距塌陷。在盒子的嵌套中，会出现外边距塌陷的问题，也就是当父元素与子元素同时设置外边距时，会出现不能设置子元素外边距的情况。

解决方法：触发bfc。

触发bfc的条件：

1. body根元素 ，body就是一个BFC区域；
2. 浮动，不包括none；
3. 定位，绝对定位absolute或固定定位fixed（二者都具备行内块特点）；
4. display为inline-block、table-cell、table-caption;
5. overflow为hidden、scroll、auto， 不为visible ；
6. 弹性布局flex。

其中最为常用的方法是在父元素中加入bfc条件 : overflow:hidden;。

2、外边距重叠。当同级的盒子外边距相交时会发生重叠，取外边距大的作为两个盒子相交处的外边距。