如何確保按鈕在不同電腦解析度下居中顯示

Question

移動解析度

所以我正在使用bootstrap，並成功將其居中，但當我改變解析度/縮小它時，按鈕換行並稍微向右移動了一點，有人可以告訴我我做錯了什麼嗎？

--HTML--
<div class="d-grid gap-2 col-2 mx-auto text-center">
       <button id="Get" class="btn btn-outline-success btn-lg" type="button">最新上傳</button> </div>

--CSS--
#Get {
    border-width: 4px;
    font-family: Lexend;
}

我試圖將其居中，對於較大的解析度可以工作，但在移動解析度上向左移動了

Answer 1

您可以嘗試將相對定位position: relative 新增至父級<div>，然後將絕對定位position: absolute 新增至按鈕，並加上left: 50%; top: 50%; transform: translate(-50%, -50%);。

這樣，按鈕的位置將獨立於解析度和螢幕大小。希望能夠解決您的問題。

Answer 2

雷雷 雷雷