stefan: Wie definiere ich einen Zeilenabstand (nicht Zeilenhöhe)?

Beitrag lesen

Hi,

soweit ich sehe gibt es keine CSS-Attribut für den Zeilenabstand. Mit dem Attribut line-height lässt sich lediglich die Zeilenhöhe bestimmen, was meist eine Simulation des Zeilenabstandes zulässt, aber in meinem Fall nicht hilft. Wie kann man einen echten Zeilenabstand faken?

Jetzt heisst's mal wieder Rätselraten...

Wenn Dir line-height nicht hilft, heisst das ja vielleicht, dass Du die einzelnen Zeilen mittels dem CSS-Attribut "background" farbig unterlegen willst, oder sowas in der Art (hab ich jetzt mal geraten). Gleichzeitig willst Du aber einen Abstand zwischen den einzelnen Zeilen haben, also pro Zeile einen einzelnen farbig unterlegten Streifen.

Sollte dem so sein, geht das mittels einer Verschachtelung zweier Elemente. In etwa so:

<p style="line-height:160%">
<span style="line-height:100%;background:#FF0000">
Ich bin ein farbig hinterlegter Tetxt mit so viel zeilenumbrüchen, wie Du willst.
</span></p>

Ich weiss nicht, ob dieses Bsp. jetzt hinhaut (ich hatte zwar mal sowas gemacht, weiss aber nicht mehr so genau wie). Der *Trick* an der Sache ist, einen Absatz <p> mit grosser Zeilenhöhe zu schaffen und diesen mit einem inline-Element (z.B. <span>) zu füllen, welches nicht die Zeilen-höhe von p erreicht. Dadurch entsteht ein Abstand zwischen den einzelnen Zeilen.

Gegebenenfalls musst Du noch etwas mit margin (beim <span>) bzw. padding (beim <p>) bzw. line-height mit "em" als Einheit (beim <span>) experimentieren.

Ach ja, es emfiehlt sich ausserdem, das Ganze in vielen verschiedenen Browsern zu betrachten, da die Zeilenhöhe von Browser zu Browser (gerade bei "%"-Angaben) voneinander abweichen kann.

viel Erfolg + schö
stefan

PS: wenn Du mal wieder ein Problem hast, wo etwas "in Deinem Fall nicht hilft", dann schreib doch, warum das so ist, bzw. worauf Du hinaus willst. Sonst tappt man da ein bisschen im Dunkeln (und macht sich vielleicht um sonst Gedanken). Nix für ungut, nur'n Tipp.