html – 父div继承子divs margin

前端之家收集整理的这篇文章主要介绍了html – 父div继承子divs margin前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
它并不是一直发生的,但每隔一段时间,父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.

猜你在找的HTML相关文章