为什么我的HTML表格占用的高度超过了必要？

Question

我有一张桌子，在同一行中有一堆相同的图像。图片的高度为21px，但表格的单元格的渲染高度为25px（在Chrome，Safari和Firefox中）。

表格中没有其他内容，据我所知，没有边距，边框或填充。那么为什么我的桌子比需要的高呢？

这是一个例子：

http://jsfiddle.net/q6zy17dz/

这是表格的一个简单示例：

<table>
    <tbody>
        <tr>
            <td><img src="http://i.imgur.com/b2f5t2B.png"></td>
            <td><img src="http://i.imgur.com/b2f5t2B.png"></td>
            <td><img src="http://i.imgur.com/b2f5t2B.png"></td>
            <td class="datetime"></td>
            <td><img src="http://i.imgur.com/b2f5t2B.png"></td>
            <td><img src="http://i.imgur.com/b2f5t2B.png"></td>
            <td><img src="http://i.imgur.com/b2f5t2B.png"></td>
        </tr>
    </tbody>
</table>

额外的问题：是否有一种方法可以在不使用表（也没有使用浮点数）的情况下重新创建此布局？

Answer 1

默认情况下，表中的图像会获取计算display:table-cell属性。

你应该设置 img { display: block; }