以前关于上下margin的重叠,不叠加取其中较大的一个,主要是并列的,并没有包含嵌套关系。
现在外层div和内层div都设有margin的时候,也会出现叠加取较大一个的现象。
# box { margin:20px;background-color:red; }
p { margin:40px;background-color:blue; }
<body>
<div id="box">
<p>我们都是好孩子</p>
</div>
</body>
本来box相对于外边是20px,现在变成了40px。。。。
解决办法:
给外层div加个border或者随便加个padding,如padding:1px就能搞定。