display：表单元格添加图像时的奇怪行为

Question

我的列有display：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属性。