[HTML][CSS]Różne odstępy w zależności od przeglądarki. Opcje

[Generic]

Witam. Mam problem z tekstem który jest na różnej wysokości w zależności od przeglądarki (1px). Różnica jest pokazana na obrazku poniżej. Utworzyłem nową strone dla sprawdzenia czy może ja nie popełniłem jakiegoś błędu tworząc swoją strone, ale problem jest również na nowo utworzonej stronie. Próbowałem to naprawić resetami, normalize css, html5reset ale nic nie pomogło. wpisywałem również *{margin: 0; padding: 0;} i również nie pomaga. Co może być nie tak? Czy zostaje mi napisać oddzielne arkusze dla każdej z przeglądarek ustawiając różne wysokości dla tekstu?

(IMG:http://i.imgur.com/NcCgkYv.png)

[Comandeer]

Nie sądzisz, że ta różnica jest na tyle minimalna i w żaden sposób nie zakłóca odbioru strony, że szykowanie osobnych stylów dla różnych przeglądarek to przerost formy nad treścią? Strona to nie druk - nie musi wszędzie wyglądać identycznie (polecam spojrzeć na prezentację Zakasa o Progressive Enhancement 2.0: http://www.slideshare.net/mobile/nzakas/pr...nhancement-20); zwłaszcza, że to jest tak drobna różnica.

Jasne, można przygotować oddzielne style dla liska (wykorzystując jakiś selektor z -moz), ale IMO to zbyteczne.

Ten post edytował Comandeer 13.06.2015, 07:44:53

[Skie]

Z tego co piszesz to spróbowałbym na Twoim miejscu jeszcze pobróbować z valign, vertical-align, layoutami, line-height i display, bo widzę że wszelkie pozycjonowanie , czcionkę i niezbędne resety już zrobiłeś.

Jeżeli wciaż będziesz miał problem, to biorąc pod uwagę jak mała jest to różnica to może to być po prostu różnica między rendererem FF i Chrome i nie obejdziesz tego inaczej niż osobne style. W każdym razie widzę również, że ta różnica dotyczy jedynie wyświetlania tego tekstu, a faktyczny rozmiar czerwonego elementu się nie zmienia także nie sądzę byś powinien się tym przejmować. Takie malutkie różnice zawsze będą występowały przy renderowaniu stron i tego nie obejdziesz w żaden sposób, bo zawsze znajdziesz coś co na jakieś wersji którejś przeglądarki wyświetli się minimalnie inaczej, ale wcąż zgodnie z css i standardami (IMG:style_emoticons/default/smile.gif)

[fate]

No ale podaj kod albo link, jaka to czcionka? Też kiedyś miałem idealistyczne podejście ale potem zacząłem tworzyć bardziej RDW stosując % zamiast px i nerwica natręctw mnie już nie dręczy bo np w IE praktycznie zawsze mam inaczej (IMG:style_emoticons/default/specool.gif)

[Generic]

Z tego co piszesz to spróbowałbym na Twoim miejscu jeszcze pobróbować z valign, vertical-align, layoutami, line-height i display, bo widzę że wszelkie pozycjonowanie , czcionkę i niezbędne resety już zrobiłeś.

Jeżeli wciaż będziesz miał problem, to biorąc pod uwagę jak mała jest to różnica to może to być po prostu różnica między rendererem FF i Chrome i nie obejdziesz tego inaczej niż osobne style. W każdym razie widzę również, że ta różnica dotyczy jedynie wyświetlania tego tekstu, a faktyczny rozmiar czerwonego elementu się nie zmienia także nie sądzę byś powinien się tym przejmować. Takie malutkie różnice zawsze będą występowały przy renderowaniu stron i tego nie obejdziesz w żaden sposób, bo zawsze znajdziesz coś co na jakieś wersji którejś przeglądarki wyświetli się minimalnie inaczej, ale wcąż zgodnie z css i standardami (IMG:style_emoticons/default/smile.gif)

pomaga globalne dodanie line-height: 1.444, wtedy wszystkie teksty na stronie są na tej samej pozycji.

@Fate to zwykły Arial.

[fate]

normalize.css