CSS/Eigenschaften/text-indent

Browserunterstützung
caniuse.com

Die Eigenschaft text-indent bestimmt bei mehrzeiligem Fließtext die Ein- oder Ausrückung des Texts in der ersten Zeile des Blockelements.

Erlaubte Werte

Weite each-line hanging

Die Weite gibt an, um wieviel ein- oder ausgerückt wird. Hierfür ist die Angabe einer Länge (auch negativ) oder eines Prozentwertes (der sich auf die Elementbreite bezieht) zulässig.

Die Schlüsselwörter hanging und each-line können optional hinzugefügt werden. Sie existieren schon über 10 Jahre in der CSS Text Level 3 Spezifikation, werden aber von Chromium-Browsern bisher nur als experimentelle Features bereitgestellt. In Firefox Safari sind sie mittlerweile verfügbar. Beachten Sie bitte die Kompatibilitätsinformationen bei caniuse.

• hanging: Es wird nicht eingerückt, sondern ausgerückt. Sie können sich das so vorstellen, dass der gesamte Text, außer der ersten Zeile, um den genannten Wert eingerückt wird.
• each-line: Die Ein- oder Ausrückung wird zusätzlich auf diejenigen Zeilen angewendet, die auf einen erzwungenen Zeilenumbruch folgen

Vererbung steuernde Werte inherit, initial, unset und revert

Standardwert

inherit

anwendbar auf

Blockelemente

Vererbung

ja

animierbar

ja

Beispiel

p {
  text-indent: 10%;
}

rückt die erste Zeile um 10% der Breite des Blockelements ein

Empfehlung: Den Effekt von hanging können Sie nachbilden, indem Sie einen negativen Wert für text-indent setzen und dem Absatz ein gleich großes padding-left geben.

Siehe auch

• CSS-Tutorials: Textausrichtung

Weblinks

• Spezifikation (W3C): text-indent CSS1 Text formatting model details
• MDN: text-indent
• Details: caniuse.com