這個問題在這里已經有了答案： 如何在 div 塊內居中文本（水平和垂直）？ (27 個回答) 9 小時前關閉。
提前道歉，因為我確定我在這里遺漏了一些非常明顯的東西，但我似乎無法讓這個按鈕文本在其父 div 中集中對齊。
我一直試圖通過在內部 div 上使用背景顏色來評估情況，但這并沒有帶來多少運氣。我在互聯網上徘徊尋找答案，但我發現的所有解決方案似乎都不起作用。
任何人都可以提供幫助？
下面是帶有箭頭影像的代碼的外觀： 在此處輸入影像描述
#button {
width: 300px;
height: 60px;
background: lightcoral;
}
#buttoncontents {
display: inline-block;
background: lightgreen;
width: 200px;
margin-left: auto;
margin-right: auto;
}
#buttontext {
display: inline-block;
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
font-size: 30px;
line-height: 0px;
color: #eeeeee;
}
#arrow {
height: 30%;
display: inline-block;
}<div id="button">
<div id="buttoncontents">
<h3 id="buttontext">Shop now </h3> <img id=arrow src="arrow.png">
</div>
</div>uj5u.com熱心網友回復：
#button {
width: 300px;
height: 60px;
background: lightcoral;
position: relative;
}
#buttoncontents {
display: inline-block;
background: lightgreen;
height: inherit;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
}
uj5u.com熱心網友回復：
嘗試洗掉 display:inline-block;
#buttoncontents {
display: block;
background: lightgreen;
width: 200px;
margin-left: auto;
margin-right: auto;
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/361713.html