邊距：自動；不適用於內聯塊元素

在 CSS 中，margin:auto;通常用於在頁面上水平居中塊元素。但是，當應用於內聯塊元素時，此屬性變得無效。

內聯塊元素像內聯元素一樣流入頁面內聯，但可以具有特定的寬度和高度。當嘗試使用 margin:auto 將它們水平居中時，此行為會產生困難；。

舊代碼：

#container {
    /* Other styles... */
}
.center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

在此程式碼中，#container 元素具有特定寬度並觸發預期的居中行為。

新代號：

#container {
    /* Other styles... */
    display: inline-block;
}
.center {
    margin: 75px auto;
    position: relative;
}

將 #container 的顯示屬性改為 inline-block 會改變它與邊距的互動方式。內聯塊元素的行為與區塊元素不同，且無法使用 margin:auto; 居中;。

解決方案：

使內聯塊元素居中水平方向，請在其包含元素上使用text-align: center 屬性：

.center {
    text-align: center;
}

這會將內聯塊元素與其包含區塊元素的中心對齊。