图片展开表格单元格答案

【问题标题】：Image expands the table cell图片展开表格单元格
【发布时间】：2017-11-20 19:16:53
【问题描述】：

我有一张 600x90 的图片，我想要一个尺寸正好为 600x90 的表格单元格。

但我在网上尝试了 overflow:hidden 和其他一些解决方案，但它仍然会为几张图片展开表格单元格。

目前我能得到的最好的是 600x93，但它在底部留下 3 个空白像素，看起来很尴尬！

有人可以帮我找到解决方案吗？

【问题讨论】：

【解决方案1】：

图片默认有

display:inline

在大多数浏览器中会增加 3-5 像素的高度。

尝试像这样设置图片的css：

table.myTable td.withImage img { display:block; }

看看它是否有效。

【讨论】：

图片默认显示：inline-block
@Tomas：这可能是可能的，但 inline-block 意味着，该元素本身的行为就像它的块（因此 w/h 有效，填充有效），但在流动中它就像它是 inline ，因此在这种情况下，这是它的行为的一部分......所以基本上，它是内联的:)
@Tomas, but: 'An image has display: inline by default' [quirksmode.org/css/quirksmode.html ] 并且 webkit 检查器和 firebug 都给出'inline'，所以我不认为内联阻止它是。

【解决方案2】：

我在一些默认图像显示类型为内联且位于某个假想线之上的浏览器中看到了这种情况。尝试将 display:block 添加到您的图像类。

如果这没有帮助，请告诉我们是跨浏览器问题还是只是 FF/IE/其他问题。也可以举个例子。

【讨论】：