wilmaed: vertical-line: warauf bezieht sich text-top ?

Beitrag lesen

problematische Seite

MDN: "text-top Aligns the top of the element with the top of the parent element's font."

https://developer.mozilla.org/en-US/docs/Web/CSS/vertical-align

Da dachte ich mir: "text-top positioniert am oberen Rand innerhalb der Zeilenhöhe". Diese Wirkung hat aber text-bottom (genau umgekehrt) … also falsch verstanden.

Beispiel: (siehe codepen)

line-heigt: 80px. Der Buchstabe A ist auf der Baseline ~73px top, T hat seine "Baseline" bei ~45px top, X ~101px top.

Wie ergeben sich diese 45px? T ist bottom von was?