自動匹配左側框的高度

Question

我不確定這是否可以使用純CSS完成，還是需要jQuery？無論如何，我希望箱子兩邊的高度相同，所以如果右邊的內容比左邊的長，左邊將跟隨右邊框的高度。

這裏是我的fiddle

我的CSS

#wrapper { 
    width: 300px; 
} 
.box { 
    width:100px; 
    background: #ccc; 
    float:left; 
    margin: 10px; 
} 
.box:nth-child(2n+0) { 
    height:auto; 
} 

Answer 1

嘗試使用display:table

demo

#wrapper { 
    width: 300px; 
    display:table; 
} 
.box { 
    width:100px; 
    background: #ccc; 
    /* float:left;*/ 
    display:table-cell; 
    border: 10px solid #fff; 
    padding:10px; 
}