何らかの理由で、Firefoxの要素は CSS宣言buttonを尊重していないようです。paddingdisplay: block
Chrome および Firefox でこの JSFiddle を参照してください: http://jsfiddle.net/DgeQ6/
Chrome ではパディングが機能するが、Firefox では機能しないことに注意してください。要素padding内でFirefox に注意を向けさせるにはどうすればよいですか?button
これは、私のマシンの Firefox でどのように見えるかのスクリーンショットです。
パディングは 20px にする必要がありますが、影響はありません。
クレジットは以下の Boris に行く必要がありますが、OS レベルのボタン スタイルをオーバーライドするには -moz-appearance:none を使用する必要があります。ここにフィドルがあります: http://jsfiddle.net/DgeQ6/8/。
HTML
<button class="btn-large">Hello</button>
CSS
.btn-large {
padding: 100px;
-moz-appearance: none;
}
また、Twitter Bootstrap は、Firefox のボタンに対してパディングと共に「border-radius」スタイルを設定するだけで、同じ効果を実現しているように見えることにも注意してください。
ボタンの Mac ネイティブ テーマの外観がパディングをオーバーライドするため、パディング自体は Mac では機能しません。たとえば、Windowsでは問題なく動作します。Linux での振る舞いが何なのか思い出せません。
これに対処する最も安全な方法は-moz-appearance: none、ネイティブ テーマの外観を削除するかどうかを設定することです。
私のFirefoxではこのように見えます。