我正在嘗試將angular中的文本(h1)居中對齊。文字在Chrome中可以正常對齊，但在Safari中卻不能正常作業。我猜想top:50%在Safari中不起作用。 謝謝。
目前的CSS：
h1{
font-weight: bold;
text-align: center;
margin: auto;
position: relative;
top: 50%;
transform: translateY(-50%);
}
參考圖片供您參考：
Chrome:
Safari:
uj5u.com熱心網友回復：
試試align-self: center代替
span class="hljs-selector-tag">h1{
font-weight: bold;
text-align: center;
margin: auto;
position: relative;
-webkit-align-self: center; //safari 7
align-self: center;
}uj5u.com熱心網友回復：
試試這個-webkit-align-self: center;
h1{
font-weight: bold;
text-align: center;
margin: auto;
position: relative;
top: 50%;/*洗掉這個*/。
transform: translateY(-50%);/*洗掉這個*/。
-webkit-align-self: center; //safari 7
align-self: center;
}
uj5u.com熱心網友回復：
你不需要使用位置屬性來做你需要的事情。 如果你使用flexbox屬性，你可以做完全相同的事情，但可能沒有safari的奇怪行為。
我不建議像其他答案所建議的那樣，使用瀏覽器擴展的CSS黑客技術
。看看我的例子吧
。div {
height: 100px;
border: solid 1px #f00;
display: flex;
justify-content: center;
align-items: center;
}<div>
<h1>一些文本</h1>/span>
</div>PS：邊框和高度屬性只是為了可視化的目的，你不需要使用它們
。轉載請註明出處，本文鏈接：https://www.uj5u.com/net/333717.html
標籤：
上一篇：如何將DD/MM/YYYY"13/09/21"轉換為"4月1日，星期二"
下一篇：過渡到淡化一個元素不作業