按钮中的图像：奇怪的空间

Question

首先是Firefox 4 Beta 8中的结果：

Button vs Div http://b.imagehost.org/0419/buttonSpace.png

显示的前一个元素是button，img后者是div，img。正如您在前一种情况中所看到的，img的边界与button的边界之间存在一些奇怪的空间。我想知道如何删除它。

这里是CSS文件：

* {
    margin: 0;
    padding: 0;
}

button, img, div {
    border: 1px solid black;
}

img {
    display: block;
}

Answer 1

在其他浏览器中测试上述测试用例表明，这可能不是CSS问题，而是Firefox中的一个错误。经过一些研究后，我发现了这个错误报告：Bug 140563 - <button> ignores CSS style padding:0

在该错误报告中有一个问题的解决办法：

button::-moz-focus-inner {padding:0; border:0}

Answer 2

我认为您必须为width

设置div

Answer 3

看起来你要求的padding没有被应用。您是否尝试在按钮上明确设置它？