CSS:Chrome中按钮的大小与Firefox不同?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (28)

我有以下HTML代码:

<style type="text/css">
.submitbutton{margin-left:-2px;padding:1px}
</style>
...
<form> 
... 
<input class=submitbutton type=submit value="Create Listings" /> 
</form>

在Firefox中,输入按钮比Chrome有更多的padding。

提问于
用户回答回答于

即使你作为开发人员在不同浏览器中进行测试并查看按钮的差异,用户也不会。 将注意力集中在用户不会注意的事情上太容易了:用户可能拥有Firefox或其他IE或Chrome,但不是全部。 很少有用户随着时间的推移切换浏览器,更不用说在它们之间切换,并抱怨几个像素差异。

因此,如果你一次只考虑一个浏览器中的按钮和体验,并且它在该体验/浏览器中运行良好,那么请不要花费更多时间。 而是转到下一步。

用户回答回答于
/* Remove button padding in FF */
button::-moz-focus-inner {
    border:0;
    padding:0;
}

在Chrome和Firefox中,你将获得相同的按钮外观。

扫码关注云+社区