Niezgodność wysokości przycisku (w przeglądarce)

Mam problem z ustawieniem wysokości przycisku. Zasadniczo nie udaje mi się mieć tego w różnych przeglądarkach. W przypadku przeglądarki Firefox jest ona wyższa niż normalna, bez żadnego powodu.Niezgodność wysokości przycisku (w przeglądarce)

Tutaj znajduje się zrzut ekranu (Firefox, Safari i Opera, w tej kolejności):

Initial

A oto kod: http://jsfiddle.net/TMUnS/2/

Próbowałem też dodać kilka konkretnych deklaracji znalazłem w web, ale w rzeczywistości po prostu zmniejszyły nieco wysokość, ale nadal nie są takie same (w tej samej kolejności):

Second try

A tutaj kod: http://jsfiddle.net/TMUnS/4/.

Jak mogę to naprawić?

Źródło

2012-02-08 entropid

Cóż, to się po prostu dzieje i to pytanie zostało zadane w nieskończoność. Wejścia i doskonałość pikseli nie mieszają się przez większość czasu z powodu niespójności przeglądarki. Proponuję zacząć od czegoś w stylu ** normalize.css **, a następnie dostosować od tego. – elclanrs

Mam już reset, ale chyba nie resetuje tego. – entropid

Firefox ma tę zabawną rzecz o nazwie -moz-focus-inner. Nie jestem całkowicie pewien, co to jest za, ja po prostu wiem, że czasami trzeba to zrobić, żeby zachowywać się przyciski:

button::-moz-focus-inner, 
[type="button"]::-moz-focus-inner { 
    padding:0; 
    border:0; 
}

To może być to, czego potrzebujesz. Możesz zobaczyć różnicę tutaj (w Firefox): http://jsfiddle.net/TMUnS/9/

Źródło

2012-02-08 01:57:30

Cóż, właściwie ustawiłem tę właściwość, ale zapomniałem dodać części "dopełnienie: 0", więc nie działało poprawnie! Ale teraz mam nowy problem, który można zobaczyć tutaj: http://jsfiddle.net/TMUnS/12/. Przyciski mają tę samą wysokość, ale w przeglądarce Firefox nie jest w porządku. – entropid

Nie widzę twojego problemu wyraźnie. Niektóre rzeczy do zapamiętania: 1) Demo, z którym właśnie się łączyłeś, nie zawiera kodu '-moz-focus-inner' 2) Nie określiłeś' rodziny czcionek'. Dostaję różne domyślne czcionki w Chrome VS Firefox, więc inne renderowanie. 3) '

Podejrzewam, że to zależy od ciebie. Dzięki za wskazówkę. :) – entropid

Czy używasz resetowania CSS? A CSS-Reset normalizuje CSS dla przeglądarek.

Spróbuj zresetować YUI: YUI CSS RESET

Źródło

2012-02-08 01:51:55 thisisablock

Używam już resetowania CSS: http://meyerweb.com/eric/tools/css/reset/. – entropid

Jest to zestaw funkcji w Firefoksie, który ogranicza line-height przycisków. Ustawia domyślną wysokość linii dla przycisków - http://www.cssnewbie.com/input-button-line-height-bug/. Chciałbym spróbować użyć stałej wysokości dla przycisków i zabawy z paddingiem.

Źródło

2012-02-08 01:54:53

Tak, to najlepsze, co możesz zrobić. Naprawiono wysokość i tę samą wysokość linii, aby wyśrodkować tekst w pionie. Użyłem tej techniki z przyciskami wyszukiwania, które dotykają wprowadzania tekstu, dlatego ważne jest, aby wyglądał on spójnie we wszystkich przeglądarkach. – elclanrs

Niezgodność wysokości przycisku (w przeglądarce)

Odpowiedz

Powiązane problemy