margin Bug
margin 塌陷
父子嵌套的垂直方向上的margin取最大值
margin 合并
兄弟元素的垂直方向上的margin取两元素的margin值之和
解决方案
触发bfc
什么是bfc?
block format context
块级格式化上下文
每一个元素都有一套属于自己的渲染逻辑,如同细胞中的DNA
bfc的设定能够让特定的盒子/元素有拥有自己的渲染逻辑或者说是不一样的渲染逻辑
如何触发bfc?
- position:absolute
- display:inline-block
- float:left/right
- overflow:hidden