Firefox和Chrome之间按钮宽度的差异

Question

我知道有很多FF/Chrome CSS问题,但我似乎无法找到这个问题.

这是一个JS小提琴显示问题:http://jsfiddle.net/ajkochanowicz/G5rdD/1/

(长篇CSS的道歉,这是从网站上复制的.)

从本质上讲,Firefox和Chrome为按钮的最内部宽度4和6提供了两个不同的值.我希望它们都是4或更少.是什么造成的？

Answer 1

尝试添加下面的CSS.Firefox在按钮上添加了额外的填充.

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

相关:删除Firefox中的额外按钮间距/填充

资料来源:http://wtfhtmlcss.com/#buttons-firefox-outline

Answer 2

您没有指定width除 之外的其他内容auto。

不同的渲染引擎对网站的渲染方式有不同的看法。

width将4px和更改为您想要的任何内容怎么样:hover？