CSS：Chrome中的按钮大小不同于Firefox [英] CSS: Size of buttons in Chrome is different than Firefox

问题描述

我有以下HTML代码：

 < style type =text / css> 
 .submitbutton {margin-left：-2px; padding：1px} 
< / style> 
 ... 
< form> 
 ... 
< input class = submitbutton type = submit value =创建列表/> 
< / form> 
 

在Firefox中，输入按钮的填充量比Chrome多。

任何想法为什么？

更新：如果你想知道为什么我有负余额 - 这是因为在输入字段和输入按钮 - 有太多的空间。

解决方案

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

您将在Chrome和Firefox中看到相同的按钮外观。 >

I have the following HTML code:

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

In Firefox, the input button has more padding than in Chrome.

Any ideas why?

UPDATE: If you're wondering why I have the negative margin - it's because between the input field and the input button - there is too much space.

解决方案

/* Remove button padding in FF */
button::-moz-focus-inner {
    border:0;
    padding:0;
}

You'll get the same button appearance in Chrome and Firefox.

这篇关于CSS：Chrome中的按钮大小不同于Firefox的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！