Ako urobiť tlačidlo Firefox rešpektovať padding? - css, google-chrome, firefox, polstrovanie

Z nejakého dôvodu Firefox button prvky nezdá sa, že rešpektujú CSS padding deklarácie, aj keď ich robíte display: block,

Pozrite si tento JSFiddle v prehliadači Chrome a Firefox: http://jsfiddle.net/DgeQ6/

Všimnite si, ako výplň funguje v prehliadači Chrome, ale nie vo Firefoxe. Ako dostanem Firefox, aby venoval pozornosť padding v button prvky?

Tu je screenshot o tom, ako to vyzerá v prehliadači Firefox na počítači:

https://www.evernote.com/shard/s217/sh/dc349236-9a7e-46f2-ae77-3a7581fa78c1/ea90d1f4a880ba64257fdd744b9fabcf

Vankúš má byť 20 pixlov, ale to nie je ovplyvnené.

odpovede:

4 pre odpoveď č. 1

Kredit by mal ísť do Boris nižšie, ale musíte použiť -moz-appearance: žiadny na prekonanie styling tlačidla OS. Tu je husle: http://jsfiddle.net/DgeQ6/8/,

HTML

<button class="btn-large">Hello</button>

CSS

.btn-large {
padding: 100px;
-moz-appearance: none;
}

Treba tiež poznamenať, že Twitter Bootstrap zdá sa, že dosiahne rovnaký účinok pre svoje tlačidlá v prehliadači Firefox, a to len tým, že má tvar "border-radius" spolu s polstrovaním.


2 pre odpoveď č. 2

Padding sám o sebe nepracuje na počítači Mac, pretožePrirodzený pohľad na tlačidlá na Mac je nahradený polstrovaním. V systéme Windows funguje napríklad dobre. Nemôžem spomenúť, aké je správanie na Linuxe.

Najbezpečnejším spôsobom, ako to zvládnuť, je nastaviť -moz-appearance: none ak chcete odstrániť prirodzený vzhľad.


0 pre odpoveď č. 3

tu zadajte popis obrázku

Vyzerá to v mojom firefoxe.


Ponuka