为什么div的位置受其孩子的利润率影响？ [英] Why position of div is affected by margin-top of its child?
本文介绍了为什么div的位置受其孩子的利润率影响？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
这是我的标记
CSS
body {
背景颜色：＃353535;
}
#parent {
background-color：#eee;
}
#child {
background-color：＃1b1b1b;
margin：60px auto 10px;
width：100px;
HTML
< div id =parent>
< div id =child>子< / div>
< / div>
结果： http://jsfiddle.net/W74TZ/
解决方案
保证金折叠规则。如果margin-top达到< body> 的顶部而没有任何冲突（如#parent上的padding-top：1px），那么父级将继承 。
您可以通过在 #parent上设置代替。 padding-top：60px 来避免这种情况
Here is my markup
CSS
body{
background-color:#353535;
}
#parent{
background-color:#eee;
}
#child{
background-color:#1b1b1b;
margin:60px auto 10px;
width:100px;
}
HTML
<div id="parent">
<div id="child">child</div>
</div>
Result: http://jsfiddle.net/W74TZ/
解决方案
Margin collapsing rules. If the margin-top reaches the top of the <body> without anything conflicting ( like a padding-top:1px on #parent ) then the parent will "inherit" that.
You can avoid this by setting a padding-top:60px on #parent instead.
这篇关于为什么div的位置受其孩子的利润率影响？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
