Die word-spacingEigenschaft ähnelt letter-spacing, obwohl ihre Verwendung natürlich den Abstand zwischen den Wörtern in einem Textstück bestimmt, nicht die einzelnen Zeichen.
p ( word-spacing: 2em; )word-spacing kann drei verschiedene Werte erhalten:
- Das Schlüsselwort "normal", mit dem der Standardabstand zurückgesetzt wird
- Längenwerte mit beliebigen CSS-Einheiten (am häufigsten px, em, rem)
- das Schlüsselwort "erben", das das
word-spacingdes übergeordneten Elements anwendet
Die beste Vorgehensweise zu diesem Zeitpunkt wäre die Verwendung em. Die Schriftgröße kann angepasst werden, sodass die Verwendung von Pixeln zu Problemen führen kann, da der Abstand zwischen den Wörtern nicht so skaliert werden kann wie ihre Größe. remist normalerweise großartig, aber die Browserunterstützung ist geringer und in diesem Anwendungsfall ist es wahrscheinlich am besten, wenn der Abstand direkt für die Wörter relevant ist, auf die er angewendet wird, nicht für die Wurzel.
Es ist wichtig zu beachten, dass „Wort“ in diesem Zusammenhang tatsächlich ein einzelnes Stück Inline-Inhalt bezeichnet - was bedeutet, dass sowohl Elemente als auch Elemente word-spacingbetroffen sind. In diesem Beispiel werden mehrere solcher Elemente durch Festlegen des übergeordneten Containers voneinander getrennt :inline-blockinlineword-spacing
Sehenswürdigkeiten
- Die
word-spacingEigenschaft kann mit CSS-Übergängen animiert werden. - Die Verwendung des „Prozentwerts“ zur Bestimmung des Abstands ist gemäß Spezifikation zulässig, kann jedoch zu unvorhersehbaren Ergebnissen führen - oftmals überhaupt keine Auswirkung.
- Das Setzen des Leerraums auf Null ist eine der Möglichkeiten, um den Abstand zwischen Inline-Blockelementen zu bekämpfen.
Browser-Unterstützung
| Chrom | Safari | Feuerfuchs | Oper | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Funktioniert | Funktioniert | Funktioniert | Funktioniert | Funktioniert | Die meisten | Funktioniert |
Hinweis zur Unterstützung von Android-Browsern: Die überwiegende Mehrheit der Android-Geräte unterstützt word-spacingjedoch einige Geräte, die nicht von Apple stammende Webkit-Builds oder den Netfront-Browser verwenden. Die Einzelheiten sind im obigen QuirksMode-Link aufgeführt.