双边距重叠问题
1. 什么是双边距重叠
多个相邻的(兄弟或者父子关系)标准流中的块元素垂直方向的margin会重叠。
2. 折叠结果
两个相邻的外边距都是正数的时候,折叠结果就是它们两者之间较大的值
两个相邻的外边距都是负数的时候,折叠结果就是它们两者之间绝对值的较大值
两个相邻的外边距一正一负的时候,折叠结果就是它们两者相加的和
3. 如何解决双边距重叠
- 给其中的一个div添加一个父的div,并且为这个div设置边框或者实现overflow:hidden;
- 将块级div设置成行内div(display:inline-block;)