顯示：添加圖像時表格單元格的奇怪行爲

Question

我有列顯示：table-cell（以確保它們具有相同的高度。）每列中都有一些文本。當我將圖像添加到其中一個單元格時（文本頂部），所有列中的文本被壓下，而不僅僅是圖像列。有沒有辦法阻止其他欄中的文字移動？

<div class = 'column'> 
    <h1>Some text</h1> 
</div> 
<div class = 'column'> 
    <img src='image.png'/> 
    <h1>Some other text</h1> 
</div> 

.column {display:table-cell} 

Answer 1

這是未經測試，但你有沒有試過

.column { 
    display: table-cell; 
    vertical-align: top; 
} 

老實說，我會避免使用display: table-cell。改爲使用css設置height屬性。