text-justify

Die CSS Eigenschaft text-justify legt fest, wie der Blocksatz ausgeführt werden soll, wenn ein Element auf text-align: justify; gesetzt ist.

text-justify: none;
text-justify: auto;
text-justify: inter-word;
text-justify: inter-character;
text-justify: distribute; /* Deprecated value */
Initialwertauto
Anwendbar aufInline- und table-cell Elemente
VererbtJa
Medienvisuell
Berechneter Wertwie angegeben
Animationstypdiskret
Kanonische Reihenfolgedie eindeutige Reihenfolge definiert durch die formale Grammatik

Syntax

Die Eigenschaft text-justify  wird mit einem der Schlüsselwörter aus der folgenden Liste definiert.

Values

none
Der Blocksatz ist abgeschaltet. Dies hat den gleichen Effekt wie wenn text-align überhaupt nicht definiert ist. Diese Einstellung is nützlich, wenn man den Blocksatz dynamisch ein- und ausschalten möchte.
auto
Der Browser entscheidet, wie der Blocksatz ausgeführt wird, abhängig von Performance und Qualität, aber auch, was angemessen ist für die Sprache des Textes (z.B. Deutsch, asiatische Sprachen). Dies ist die Standardeinstellung, wenn  text-justify nicht definiert ist.
inter-word
Um den Blocksatz zu erreichen, wird Weißraum zwischen den Wörtern eingefügt (also eine Variante zu word-spacing). Diese Form ist gebräuchlich für Sprachen, die Wörter mit Leerzeichen trennen, wie Deutsch oder Koreanisch.
inter-character
Um den Blocksatz zu erreichen, wird Weißraum zwischen den Zeichen eingefügt (also eine Variante zu letter-spacing). Diese Form ist gebräuchlich für Sprachen wie Japanisch.
distribute
Zeigt das gleiche Verhalten wie inter-character; dieser Wert wird beibehalten, um Abwärtskompatibilität zu gewährleisten.

Formal syntax

auto | inter-character | inter-word | none

Beispiele

p {
  font-size: 1.5em;
  border: 1px solid black;
  padding: 10px;
  width: 95%;
  margin: 10px auto;
  text-align: justify;
}

.none {
  text-justify: none;
}

.auto {
  text-justify: auto;
}

.dist {
  text-justify: distribute;
}

.word {
  text-justify: inter-word;
}

.char {
  text-justify: inter-character;
}

Spezifikationen

Specification Status Comment
CSS Text Module Level 3
Die Definition von 'text-justify' in dieser Spezifikation.
Arbeitsentwurf

Browserkompatibilität

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidFirefox für AndroidOpera für AndroidSafari auf iOSSamsung Internet
text-justify
Experimentell
Chrome Vollständige Unterstützung 32
Hinweise Deaktiviert
Vollständige Unterstützung 32
Hinweise Deaktiviert
Hinweise inter-word and distribute (deprecated) values are supported, but distribute behavior is buggy.
Deaktiviert From version 32: this feature is behind the Enable Experimental Web Platform Features preference (needs to be set to true). To change preferences in Chrome, visit chrome://flags.
Edge Vollständige Unterstützung 12
Hinweise
Vollständige Unterstützung 12
Hinweise
Hinweise Standard values inter-character and none are supported. The deprecated distribute value is also supported.
Firefox Vollständige Unterstützung 55
Vollständige Unterstützung 55
Vollständige Unterstützung 54
Deaktiviert
Deaktiviert From version 54: this feature is behind the layout.css.text-justify.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Vollständige Unterstützung 11
Hinweise
Vollständige Unterstützung 11
Hinweise
Hinweise Standard values inter-character and none are supported. The deprecated distribute value is also supported.
Opera Vollständige Unterstützung 19
Hinweise Deaktiviert
Vollständige Unterstützung 19
Hinweise Deaktiviert
Hinweise inter-word and distribute (deprecated) values are supported, but distribute behavior is buggy.
Deaktiviert From version 19: this feature is behind the Enable Experimental Web Platform Features preference (needs to be set to true).
Safari Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 9945.
WebView Android Keine Unterstützung NeinChrome Android Vollständige Unterstützung 32
Hinweise Deaktiviert
Vollständige Unterstützung 32
Hinweise Deaktiviert
Hinweise inter-word and distribute (deprecated) values are supported, but distribute behavior is buggy.
Deaktiviert From version 32: this feature is behind the Enable Experimental Web Platform Features preference (needs to be set to true). To change preferences in Chrome, visit chrome://flags.
Firefox Android Vollständige Unterstützung 55
Vollständige Unterstützung 55
Vollständige Unterstützung 54
Deaktiviert
Deaktiviert From version 54: this feature is behind the layout.css.text-justify.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Vollständige Unterstützung 19
Hinweise Deaktiviert
Vollständige Unterstützung 19
Hinweise Deaktiviert
Hinweise inter-word and distribute (deprecated) values are supported, but distribute behavior is buggy.
Deaktiviert From version 19: this feature is behind the Enable Experimental Web Platform Features preference (needs to be set to true).
Safari iOS Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 9945.
Samsung Internet Android Keine Unterstützung Nein

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Keine Unterstützung  
Keine Unterstützung
Experimentell. Das Verhalten kann sich zukünftig ändern.
Experimentell. Das Verhalten kann sich zukünftig ändern.
Siehe Implementierungshinweise.
Siehe Implementierungshinweise.
Benutzer muss dieses Feature explizit aktivieren.
Benutzer muss dieses Feature explizit aktivieren.

Siehe auch