Zeilenhöhe in Firefox und Chrome unterschiedlich

[Kev95]

Hallo,
ich habe eine Art kleine Highscoreliste erstellt.
Dabei habe ich aber ein kleines Problem.

Die Zeilenhöhe ist leider in Firefox und Opera anders als in Chrome/Safari.

Chrome & Safari:


Firefox & Opera:


Die Seite ist komplett valid, sowohl in CSS(3) als auch in HTML(5).
Hier könnt ihr euch das auch live anschauen.

Vielen Dank schonmal, ich komme alleine nicht mehr weiter...

Gruß,
Kevin

 

[threadi]

Hab gerade nur Firefox hier, sehe dort aber ein padding-top von 9px was Du für Tabellenzellen gesetzt hast. Das ist der Grund wieso es im Firefox so aussieht wie es aussieht. Und wie ich finde macht der Firefox auch genau so wie Du es geschrieben hast. Wenn andere Browser etwas anders darstellen, dann interpretieren sie hier etwas anders. Vlt. auch weil es Tabellenzellen sind (die Du hier auch richtigerweise verwendest). Ich würde dir raten auf die 9px padding zu verzichten. Dann sollte sich die Ansicht angleichen. Evtl. solltest Du auch mit line-height statt height arbeiten.

 

[Kev95]

Dann werde ich das mal umbauen.
Ich dachte eigentlich Padding auf ner Tabellenzeile macht keine Probleme.

Das mit der line-height ist ne gute Idee.

Danke dir!

Edit: Falls noch jemand das Problem hat.
Ich habe jeweils das Padding zur Height addiert und daraus eine line-height gemacht.
Jetzt funktioniert alles!