typography

Das Web handhabt Grundlinien anders als Sie es gewohnt sind zu drucken. Browser richten Ihren Text an der Mitte der Zeilenhöhe und nicht am unteren Rand aus. Dies bedeutet, dass Text, der auf das Web-Grid ausgerichtet ist, vertikal in Bezug zueinander zentriert ist und nicht auf derselben Grundlinie sitzt.

Wenn Sie damit einverstanden sind, können Sie trotzdem ein starkes Raster erhalten. Sie müssen nur genau sein mit der kombinierten Verwendung von Zeilenhöhe, Padding, Rahmen und Rändern. Es braucht etwas Mathematik, ist aber durchaus möglich. Mehr hier:

Ссылка

Wenn Sie Dinge brauchen, die tatsächlich auf eine Grundlinie ausgerichtet sind, wie Sie es im Druck kennen, ist das Spiel viel schwieriger. Das Problem ist, dass Sie die Dinge abhängig von der exakten Schriftart in verschiedenen Mengen ausgeben müssen - kaum möglich, wenn jeder Browser eine andere Schriftart verwendet. Hier ist ein Versuch, dies zu ermöglichen:

Ссылка

Bei beiden Lösungen gibt es Cross-Browser-Probleme. Das Web bietet dazu noch nicht die richtigen Werkzeuge. Aber auf keinen Fall solltest du die divs brauchen. Sie können diese Anpassung an den Überschriften selbst vornehmen. Sie brauchen sie nicht einmal in Ihrem Beispiel. Warum sind die Divs dort?

Nur ein kurzer Gedanke (wie in "Ich hatte diese Idee, das könnte funktionieren, aber ich habe es nicht getestet"): Wie wäre es mit der Zeilenhöhe? Sie können für alle Überschriften dieselbe Zeilenhöhe verwenden, um eine einheitliche Grundlinie für alle Zeilen zu gewährleisten.

Grüße Jesper Hauge