它并不是一直发生的,但每隔一段时间,父div继承子divs属性并抛出我的布局定位.
例如,这是html(伪):
<div 1> <div 2> content here </div> </div><!-- div one end -->
Css(伪):
#1{ margin top:0; } #2 {margin top:10 }
它应该看起来像这样:
div 1是父母,div 2是孩子
div 1parent
----------------------------------------- this is address bar (top of win) ----------------------------------------- ---------------- | ---------- | | | div2Child | | ------------ | |--------------|
假设从div 1到addy窗口没有差距.
现在,由于一些奇怪的原因,使用上面相同的代码,当我预览时,我得到这个:
----------------------------------------- this is address bar (top of win) ----------------------------------------- gap here. ---------------- | ---------- | | | div2 | | ------------ | |--------------|
无论我做什么,我仍然会得到那个差距.当我把它带到萤火虫并测试Divs时,
div2清楚地表明,保证金正在影响父母的定位.
..i打算举一个例子,但是…这是实际的代码所以你可以看到……(简单可以)
HTML:
<div id="one"> <div id="two">content here on 2</div> </div> the CSS: #one{ width:1000px; height:300px; background:#09F; margin-top:0px !important; padding:0px; } #two{ width:500px; height:100px; background:red; margin-top:20px; padding:0px; }
我仍然得到我在图表中显示的差距.令我疯狂的是,像我们大多数人一样,我们已经完成了数百万次这样的布局….我可以使用同样的方法拉出DOZENS的作品并且没有问题…我有我总是使用的Cssreset.有重要的,没有随机的< br />或者< p>,0填充…事实上要确保,我创建了一个虚拟页面,只有2个div和他们的CSS仍然……..
有没有想过为什么会这样?因为现在我正在看我的最后一个网站创建和这个虚拟的html我刚刚测试并在每个浏览器上,我得到那个愚蠢的差距.
解决方法
您所观察到的是利润率下降.它可能发生在并不总是易于理解的场景中,因此我建议参考
documentation.