Firefox 中的 HTML 按钮文本对齐答案

【问题标题】：HTML button text alignment in FirefoxFirefox 中的 HTML 按钮文本对齐
【发布时间】：2015-07-09 09:51:15
【问题描述】：

使用这个 CSS：

button {
    font-size: 14px;
    height: 25px;
    width: 25px;
    text-align: center;
    vertical-align: middle;
    padding: 0;
    margin-left: auto;
    margin-right: auto;
}

我无法在 Firefox 中正确对齐某些文本。例如：

火狐 (38.0.5)

铬

[+] 按钮的水平对齐在 Firefox 中关闭，但在 Chrome 中没有？发生了什么，我该如何解决？

JSFiddle：http://jsfiddle.net/oge3tg3n/2/

【问题讨论】：

奇怪，在 FF、Chrome、Opera 中运行良好。最新版本。你在使用某种 CSS 框架吗？
刚刚在 chrome 和 FF 中测试过，工作正常
@Mikey 显然这是版本 38 的问题。刚刚安装了 39（最新），问题就消失了。没有框架——应该在 38 中可重现。
@whiskeyspider 好的。您在更改日志中找到了吗？

标签： html css firefox

【解决方案1】：

如果将高度和宽度增加到 27px，对齐将在 firefox 和 chrome 中居中。

button {
   font-size: 14px;
   height: 27px;
   width: 27px;
   text-align: center;
   vertical-align: middle;
   padding: 0;
   margin-left: auto;
   margin-right: auto;
}

在 Firefox 38.0.5 中测试。

【讨论】：