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; 
}