垂直margin合并问题

垂直margin合并问题

前提:

  同属于一个BFC的两个相邻的盒子的margin会发生重叠

描述:

  外边距合并指的是,当两个垂直外边距相遇时(水平外边距相遇的时候不会有这种问题),它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

解决办法:

  1. 使用这种特性

  2. 设置一边的外边距,一般设置margin-top

  3. 将元素浮动或者定位等(也就是创建一个新的BFC区域,让它们不属于同一个BFC就可以了)

作者:David-lcw
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
原文地址:https://www.cnblogs.com/david-lcw/p/10134240.html