CSS-Eigenschaft letter-spacing

.probe {
  letter-spacing: 2px;
}

Erlaubte Werte

Auszug aus der Spezifikation (die verwendete Syntax wird im Artikel CSS-Wertesyntax genauer erläutert):

'letter-spacing'
normal | <length> | inherit

normal (Ausgangswert)

Keine Änderung der Laufweite. Dieser Wert erlaubt es dem Anwenderprogramm, den Abstand zwischen den Zeichen zum Zweck des Randausgleichs zu ändern, wenn gleichzeitig text-align:justify gegeben ist.

<length>

Absolute oder relative Längenangabe, um die der normale Zeichenzwischenraum verlängert oder verkürzt wird. Negative Werte bewirken eine Verkürzung des Zwischenraumes. Hier ist es Anwenderprogrammen nicht erlaubt, den Abstand zwischen den Zeichen zusätzlich zum Zwecke des Randausgleichs zu ändern.

Mehr Informationen über Längenwerte in CSS finden Sie im Grundlagenartikel Längenwerte.

inherit

Bestimmt explizit, dass diese Eigenschaft denselben berechneten Wert wie im Elternelement annimmt.

Code-Beispiel

P.letter { letter-spacing: 0.2em; }

Wechselwirkungen

word-spacing, text-align

Ein Zuschlag, kein Abstand

Der Wert wird zu dem Abstand hinzugerechnet, den die Schrift ohnehin vorsieht, und ersetzt ihn nicht. Der Ausgangswert normal bedeutet also nicht null, sondern das, was die Schriftdatei für jedes Zeichenpaar bestimmt. Ein negativer Wert zieht die Zeichen entsprechend enger.

Daraus folgt, dass die Angabe mit der Schriftgröße nicht mitwächst, solange sie in absoluten Einheiten notiert ist. Eine Laufweite, die bei einer Überschrift stimmt, ist im Fließtext viel zu weit. Die Angabe in einer schriftbezogenen Einheit vermeidet das, weil sie sich auf die aktuelle Schriftgröße bezieht.

Die Seite weist auf einen weiteren Punkt hin: der Abstand zwischen Zeichen ist keine feste Größe, sondern hängt von Schriftfamilie und Schriftgrad ab. Eine Laufweite, die für eine Schrift ausgesucht wurde, passt für die Rückfallschrift nicht unbedingt.

Der Ausgangswert bedeutet außerdem, dass die Schrift ihre eigenen Paarabstände anwenden darf. Ein ausdrücklich gesetzter Wert tritt zu diesen hinzu und hebt sie nicht auf, sodass die feinen Anpassungen zwischen einzelnen Zeichenpaaren erhalten bleiben.

Wo Laufweite hilft und wo sie schadet

Zwei Fälle sprechen dafür. Versalien stehen von Haus aus zu eng beieinander, weil Schriften ihre Abstände für den Wechsel von Groß- und Kleinbuchstaben zeichnen; eine leichte Erweiterung macht eine Zeile aus Großbuchstaben deutlich lesbarer. Und sehr große Schriftgrade wirken zu weit gesetzt, weil die Abstände mitwachsen, obwohl das Auge sie nicht mehr braucht; hier hilft ein kleiner negativer Wert.

Im Fließtext ist beides falsch. Eine erweiterte Laufweite zerlegt das Wortbild, an dem das Auge Wörter als Ganzes erkennt, und verlangsamt das Lesen messbar. Eine verengte tut dasselbe von der anderen Seite.

Zu bedenken ist außerdem, dass der Zuschlag auch hinter dem letzten Zeichen eines Elements steht. Bei zentriertem oder rechtsbündigem Text verschiebt das die Zeile um diesen Betrag, was bei großen Werten sichtbar wird.

Zu bedenken ist schließlich die Wirkung auf die Silbentrennung und den Umbruch. Eine erweiterte Laufweite macht jedes Wort länger, und in schmalen Spalten kann das dazu führen, dass Wörter umbrechen, die vorher passten.

Besonderheiten im Medientyp handheld

Diese Eigenschaft ist nicht Teil des Standards CSS Mobile Profile 1.0. Mobilgeräte, deren Browser diese Eigenschaft umsetzen, sind bisher nicht bekannt.

Weitere Charakteristika

Die Stylesheet-Schnellreferenz mit einer Zusammenfassung aller visuellen Eigenschaften kann auch als PDF-Datei herunter geladen werden.

Ausgangswert

normal

Berechneter Wert

normal oder Absoluter Wert

Vererbung

Ja

Anwendbarkeit

Auf alle Elemente

%-Bezugswert

Nicht zutreffend

Mediengruppe(n)

Visual