Wie man Superscript und Subscript (Hoch- und Tiefstellung) in WordPress nutzen kann, hatte ich im letzten Post gezeigt. Leider brechen die Hoch- und Tiefstellungen je nach verwendetem Theme und CSS aus der jeweiligen Zeile aus. Das heißt im Klartext: Eine hochgestellte Zahl überdeckt entweder Zeichen/Ziffern aus der darüberliegenden Zeile oder vergrößert den Zeilenabstand, um eben nichts zu überdecken. Beides sieht ziemlich unschön aus. Um diesem Problem aus dem Weg zu gehen, reicht es nicht aus lediglich die line-height
CSS-Eigenschaft anzupassen.
Zur Lösung des Problems gibt es zwei Ansätze. Entweder man orientiert sich an der Grundlinie (Baseline) oder an der Oberkante (k-Linie / TOP-Orientierung) einer Zeile. Welche Lösung für euer Theme besser funktioniert, müsst ihr selbst ausprobieren.
Sup- und Subscript an der Baseline ausrichten
1 2 3 4 5 6 |
sup, sub { vertical-align: baseline; position: relative; } sup { top: -0.4em; } sub { top: 0.4em; } |
Superscript nach TOP ausrichten
1 |
sup { vertical-align: top; font-size: 0.6em; } |