Safari CSS兼容性问题

Question

因此，我正在编写一些支持所有浏览器的CSS，并且正在IE，Chrome，Opera，Safari和Firefox上测试它。以下CSS将#signinForm放置在除Safari之外的所有浏览器中的页面中心。

#signinForm { 
    position: absolute; 
    -webkit-position: absolute; 
    width: 400px; 
    height: 320px; 
    left: calc(50% - 200px); 
    top: calc(50% - 160px); 
    background-color: #fff; 
    border: 1px solid #ebebeb; 
    border-radius: 3px; 
    box-shadow: 0px 3px 3px -3px #ccc; 
    display: block; 
} 

我需要在代码中添加什么才能让CSS将#signinForm定位在Safari窗口的中心？

Answer 1

您可以使用：

#signinForm { 
    position: absolute; 
    width: 400px; 
    height: 320px; 
    left: 50%; 
    margin-left: -400px; /* minus the width of the div */ 
    background-color: #fff; 
    border: 1px solid #ebebeb; 
    border-radius: 3px; 
    box-shadow: 0px 3px 3px -3px #ccc; 
    display: block; 
}