margin重叠问题

我可是兔子
  • 369

两个相邻的div元素产生margin重叠问题。

margin重叠问题既然是BFC导致的,那为什么赋予一个div overflow:hidden;属性,还是会出现margin重叠问题。

使元素产生BFC的方法不是有设置元素属性:
1.float: left | right | both;
2.overflow: hidden | auto | scroll;
3.display: table-cell | inline-block | table-caption;
4.position: absolute | fixed;
四种方法吗?

我试了下我目前我遇到的情况,只有 float、display: table-caption | inline-block以及position可以解决。

overflow和display:table-cell属性为什么不行?

回复
阅读 1.7k
2 个回答
✓ 已被采纳

混淆了“产生”和“所在”,一个对内,一个对外。改变 overflow 让一个 div 内部宣布新 BFC 但对外它还是在原来的 BFC 中。

hahah
  • 4
新手上路,请多包涵

overflow是溢出的,假如说overflow是auto,然后你的盒子都是float:left,width:无限宽,那样的话就会一直横排排列,浏览器的BFC就会被打乱。
display:table-cell是属性指让标签元素以表格单元格的形式呈现,类似于td标签,就是把盒子变成一个个的格子,意思是说打乱了父级盒子的BFC

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏