【CSS】盒子模型外边距合并

问题

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

两种情况

• 嵌套块元素垂直外边距的塌陷：父元素会塌陷较大的外边距值，子元素
• 相邻块元素垂直外边距的塌陷：取两个margn值中最大的一个作为边距；

---

解决方法：

情况一：

1. 为父元素添加边框border
2. 为父元素添加overflow:hidden
3. 为父元素定义内边距padding

情况二：

1. 尽量只使用一个margin

补充：浮动、固定、绝对定位的盒子不会有塌陷问题

---

参考链接：
[1]. 我对margin外边距合并的理解