Css 为什么Firefox中没有边框的按钮比线条高出两个像素？

我有一个带有以下超简单css的按钮：

button {
  background: #005eb8;
  border: 0;
  padding: 0;
  color: white;
  line-height: 50px;
}

“线路高度”设置为50px。但是（在Firefox中）按钮是52px——我预计是50。有什么原因吗？在铬合金中，高度为预期的50

JSBIN的代码：

---

添加这样的css规则。

你会问-有什么原因吗-我相信是的。我现在手头没有Firefox，但您使用的是

按钮
html元素，按钮通常有一些默认的css规则在浏览器中应用（这些规则显然是特定于浏览器的）。我猜FF是在您自己定义的样式中添加了一些默认的
填充
、
边距
、
边框
或类似的内容。尝试显式地将这些设置为0

谷歌搜索了一下，更详细地解释了这个问题，提议的解决方案是：

button::-moz-focus-inner, 
input[type="button"]::-moz-focus-inner {
    padding: 0 !important;
    border: 0 none !important;
}

您是否设置了边距：0；在您的按钮上？将高度：50px添加到按钮样式中。@jbutler483:是的，我添加了“？html，output”，您可以看到@chrisbedoya告诉您的代码，您使用的是线条高度而不是高度，请检查另一个相关信息：使用线条高度是有意的。但是-moz focus inner的默认设置是我的问题-正如下面的人指出的那样：-）哇！这很有效。我已经花了好几个小时在这上面了，但我从来没有想过关注内心…？！：-=）谢谢。谢谢你的解释。是的，这是焦点内在！波西娅先生跑得更快：——）
button::-moz-focus-inner, 
input[type="button"]::-moz-focus-inner {
    padding: 0 !important;
    border: 0 none !important;
}