左右margin top问题百分比值

不想说今天心情有多差!

9点多開始发现一个"bug",需求是依据屏幕高度动态调整某个div的位置。代码大概是这种。

    <div style="margin-top: 25%;
                margin-left:25%; 
                      width:50px; 
                     height:50p; 
           background-color: yellow;">
    </div>

演示：

然后就发现。“当窗体宽度变化的时候，margin-top变了，变了！了。！！” ,调了一个晚上，问了好多前端群，贴上代码。居然没有人知道为什么！

！！

最后找到一句话：

'margin-top', 'margin-bottom'
Percentages: refer to width of containing block

对，没错。margin-top 设置成百分比的时候，仅仅跟父容器宽度有关！。！幅！！！谁能告诉我，为什么是宽度！！！他深受的自己的无知移动。行！来吧！

版权声明：本文博主原创文章，博客，未经同意不得转载。

转载于:https://www.cnblogs.com/bhlsheji/p/4904910.html