margin-top绑架父节点问题的分析

it2025-04-23  13

当两个空的块级元素嵌套时,如果内部的块设置有margin-top属性,那么内部块的margin-top属性会绑架父级元素

 

<div id="parrent"> <div id="box1"></div> </div> #parrent{ width:500px; height:300px; background:teal; } #box1{ width:100px; height:100px; background:aqua; margin:20px; }

解决方法:1、设置父元素或者自身的display:inline-block;2、设置父元素的border:1px aqua solid;(>0)3、设置父元素的padding:1px;(>0)4、给父元素设置overflow:hidden;5、给父元素或者自身设置position:absolute;6、设置父元素非空,填充一定的内容。

转载于:https://www.cnblogs.com/Qbright/archive/2012/05/13/2498483.html

相关资源:数据结构—成绩单生成器
最新回复(0)