如何讓所有div的大小相同，無論他們是否有內容？

Question

我正在創建一個戰艦遊戲，在板上有一個生成的網格，每個正方形都是一個帶有數字的彩色框，並且是它自己的div。我遇到的問題是，當其中一個div獲取一些額外的內容時，它會使該特定div比其餘的div更長，這會拋出整個網格。我如何確保所有的div都是相同的高度，無論他們是否有額外的內容？我曾嘗試向CSS添加高度屬性，但它不會更改彩色框的實際高度。

Answer 1

您必須定義如何處理溢出內容。

.cut-content { 
    overflow: hidden; 
} 

Answer 2

答案是height。你可能會打擊特異性。嘗試以下方法：

.grid_div { 
    height: 100px; 
    height: 100px!important; /* if the previous does not work */ 
    max-height: 100px; 
    max-height: 100px!important; /* if the previous does not work */ 
    overflow: hidden; /* just for the visual effect */ 
    display: inline-block; /* choose inline-block or block */ 
    display: block; /* choose inline-block or block */ 
}