为什么 chrome 和 safari 的 margin-top 不同？

Question

1. Chrome 和 safari 都支持webkit。那么为什么 margin-top 与 chrome 和 safari 不同呢？

2. 对此有什么解决方案？我不想尝试padding-top..由于某种原因。

这是我的响应式设计的演示代码。

<div id='demo'></div>

#demo{
    position:absolute;
    margin-top:22%;
    width:10%;
    border:1px black solid;
    height:5%;
}

JSFIDDLE

Answer 1

回答

1. 我没有得到第一个问题的答案。

但我得到了第二个问题的答案。

    <div class='test'>
       <div id='demo'></div>
   </div>

#demo{
    position:absolute;
    width:10%;
    border:1px black solid;
    height:5%;
    bottom:0;
    right:0;
}
.test{
    position:relative;
    width: 500px;
    height:500px;
}

将position:relative 添加到父div，而不是margin-top 我使用了

bottom:0;  right:0;