Firefox 和 Chrome 按钮文本基线不同答案

【问题标题】：Firefox and Chrome button text baseline differentFirefox 和 Chrome 按钮文本基线不同
【发布时间】：2020-07-11 13:38:38
【问题描述】：

Chrome 与 Firefox 中的按钮：

Firefox 中文本的基线似乎略高。有没有办法降低文字？只是根据浏览器调整边距？

Chrome CSS：

Firefox CSS：

【问题讨论】：

标签： css

【解决方案1】：

字体不同。尽管它们在 CSS 中是相同的，但它们没有被正确加载，因此其中一个浏览器使用了后备，而另一个没有。帮助调试这个document.fonts.check 非常有用。

感谢 Temani Afif 提供正确方向的指针。

【讨论】：

【解决方案2】：

使用 normalize.css。浏览器之间的大多数差异将消失https://necolas.github.io/normalize.css/

浏览器有不同的基本设置。可能 FF 默认行高比 chrome 最小。无论如何，在正常使用中没有人发现这有什么不同;)

【讨论】：