html - 为什么我在表格单元格 div 上方有很多填充

Question

我有两个相邻的表格单元格 div，但出于某种原因，其中一个似乎有一个我没有创建的巨大边距顶部，我不知道为什么。

<div style="display:table;">
<div style="display:table-cell;">
    <img src="http://a0.twimg.com/profile_images/3181865974/b3583cd60d3d21ea9b9776634084b710_normal.png" />
</div>
<div style="display:table-cell;">
    <div>Your compiler finds a big block of commented-out code… It knows it shouldn't look… Takes the tiniest of tiny peeks… BLUSHES BRIGHT RED.Your compiler finds a big block of commented-out code… It knows it shouldn't look… Takes the tiniest of tiny peeks… BLUSHES BRIGHT RED.</div>
</div>

JSFiddle:http://jsfiddle.net/HycBx/

Answer 1

两个单元格的高度相同。顶部的空格是因为文本默认为“基线”的垂直对齐方式。

将 css 添加到您的单元格:

vertical-align: top;