Pytanie Jak zresetować domyślny styl przycisku w przeglądarce Firefox 4 +


W firefox 3.6 możesz użyć ::-moz-focus-inner {border:0;padding:0;margin:0;} aby usunąć te domyślne marginesy i paddings forms.css dodany.

Jak mogę to zresetować w Firefoksie 4? Szukałem plików .css w katalogu instalacyjnym, które mogłyby dodawać style do mojego przycisku, ale nie mogę znaleźć żadnego dla ff4 - przycisk nadal dostaje denerwujące dopełnienie 1px, które nie pozwoli na wyrównanie tekstu do pionu środkowy.

http://easwee.net/other/FF_problem.gif

EDYCJA: Używam resetowania arkusza stylów, więc nie ma potrzeby resetowania stylów. To jest tutaj arkusz stylów przeglądarki.


21
2018-03-28 13:46


pochodzenie




Odpowiedzi:


Właściwie to znalazłem rozwiązanie.

W polu adresu URL: resource://gre-resources/forms.css - to otworzy plik formulas.css dla FF4 - i wyszuka następujący selektor

button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner

Teraz po prostu umieść to w swoim głównym arkuszu stylów, jak:

button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {border:0;padding:0;margin:0;}

To już nie powinno przesłonić twojego css. Należy również pamiętać, że jeśli nie zdefiniowałeś żadnego stylu czcionki dla swoich wejść, FF nie będzie dziedziczyć stylów czcionki ciała.


26
2018-03-28 14:21



Dziękuję Ci. Niestety znalezienie tych plików zasobów css nie jest już możliwe w Firefoksie 6; jednak to rozwiązało mój problem.
@ PatrickRobertSheaO'Connor W ff6 został zmieniony na resource://gre-resources/html.css - easwee
Wielkie dzieki!
+1 tak wiele dzięki ... To było zbyt frustrujące, aby znaleźć trwałe granice. - Gabriele Petrioli
Dzięki, zostałem spalony przez siebie. Niewielka uwaga: margines: 0 wydaje się niepotrzebny, ponieważ Firefox sam go nie definiuje. - Damir Zekić


spróbuj ustawić jego wartości na niezdefiniowane (border:undefined itp). nie jestem pewien, ale zadziałało to dla mnie, gdy miałem podobny problem.


1
2018-03-28 14:01



Próbowałem, ale nic dobrego. - easwee


Twitter Bootstrap robi to w ten sposób reset.less (co jest czymś więcej chudzielec wersja normalize.css):

button::-moz-focus-inner,
input::-moz-focus-inner { // Inner padding and border oddities in FF3/4
  padding: 0;
  border: 0;
}

Na marginesie, Bootstrapa reset.less jest prawdopodobnie bardziej niezawodnym i odwiecznym rozwiązaniem, które pozwoli uzyskać formę przeglądarki niż zachowanie własnych reguł. Jest o wiele bardziej kompletny niż Meyera reset.css, ale bardziej minimalistyczny niż normalize.css.


1
2018-04-11 14:44





po prostu użyj arkusza stylów resetowania css, który zresetuje domyślne css dla większości przeglądarek

http://meyerweb.com/eric/tools/css/reset/

lub przeczytaj ten artykuł z pytaniami i odpowiedziami

https://stackoverflow.com/questions/116754/best-css-reset


0
2018-03-28 13:56



Nie, nie będzie. Używam resetowania arkusza stylów. Przeczytaj to pytanie jeszcze raz, aby uzyskać to, na co mam ochotę. - easwee
tak, ale nawet jeśli znajdziesz plik CSS w Firefoksie, zmiana będzie dotyczyć tylko ciebie i nikogo innego - Christophe
Będzie się to odnosić do wszystkich, gdy tylko znajdę selektor, który je doda i nadpisam go bardziej określonym selektorem w moim głównym arkuszu stylów. Zawsze działało we wszystkich wersjach FF do tej pory. - easwee
o tak, widzę. Wygląda na to, że go znalazłeś :) - Christophe
Tak, może moje pytanie było nieco niejasne - zredagowałem kilka słów na przyszłość, jeśli ktoś to przeszuka. - easwee