如何在 CSS 中實現並排 DIV 的自動寬度相等？

在CSS 中實現並排DIV 的相等自動寬度

您有一個包含多個子DIV 的HTML 父DIV，並且您希望子DIV 自動採用相同的寬度。以下是使用 display: table 屬性實現此目的的解決方案：

#wrapper {
    display: table;
    table-layout: fixed;
    width: 90%;
    height: 100px;
    background-color: Gray;
}

#wrapper div {
    display: table-cell;
    height: 100px;
}

父 DIV 的 display: table 屬性設定類似表格的結構。 table-layout:fixed 屬性確保列（即子 DIV）具有固定寬度。子 DIV 的 display: table-cell 屬性將它們放置在表格的「儲存格」內。

此解決方案在 IE7 以外的現代瀏覽器中有效。以下是一些例子：

• 三個DIV：https://jsfiddle.net/g4dGz/
• 兩個DIV：https://jsfiddle.net/g4dGz/1/

以上是如何在 CSS 中實現並排 DIV 的自動寬度相等？的詳細內容。更多資訊請關注PHP中文網其他相關文章！