Textumbruch: `white-space`

Diese Eigenschaft gibt es seit Version CSS 1

Durch white-space wird bestimmt, wie im Quelltext enthaltene Zeilenumbrüche und Leerzeichen im Browser dargestellt werden. Die Werte »normal«, »pre« und »nowrap« gibt es seit CSS 1, die Werte »pre-wrap« und »pre-line« werden vorraussichtlich ab CSS 2.1 hinzukommen.

Code-Beispiel für `white-space`:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <title>Code-Beispiel für white-space</title>

<style type="text/css">
.pre {white-space: pre;}
.nowrap {white-space: nowrap;}
.pre-wrap {white-space: pre-wrap;}
.pre-line {white-space: pre-line;}
</style>
</head>
<body>
<p class="pre">
  Dieser Absatz
    ist mit »white-space: pre«
       formatiert.</p>

<p class="nowrap">
  Dieser Absatz
    ist mit »white-space: nowrap«
        formatiert.</p>
<p class="pre-wrap">
  Dieser Absatz
    ist mit »white-space: pre-wrap«
        formatiert.</p>

<p class="pre-line">
  Dieser Absatz
    ist mit »white-space: pre-line«
        formatiert.</p>
</body>
</html>

Beispiel ansehen

Initialwert:	normal
Vererbbar:	Ja
Anwendbar auf:	Alle Elemente (CSS 2.1, siehe Anmerkung)
Medium:	Visual
Werte:	normal Zeilenumbrüche im Quellcode werden nicht dargestellt und mehrere Leerzeichen im Quellcode zu einem zusammengefügt. Der Browser fügt einen Zeilenumbruch am Zeilenende ein. pre Zeilenumbrüche und Leerzeichen werden, vergleichbar mit dem HTML-Element<pre>, so dargestellt, wie sie im Quellcode eingegeben sind. nowrap Dieser Wert ist dem HTML-Element <nowrap> vergleichbar - Zeilenumbrüche werden vom Browser nicht vorgenommen, solange sie nicht durch <br> erzwungen werden. Mehrere Leerzeichen im Quellcode werden auf eines gekürzt. pre-wrap Ähnlich wie bei <pre> werden Leerzeichen und Einrückungen dargestellt, und der Zeilenumbruch richtet sich nach dem Quelltext. Allerdings erfolgt am Zeilenende auch ein automatischer Umbruch, wenn nicht genug Platz da ist. Diesen Wert gibt es erst ab CSS 2.1. pre-line Mehrere Leerzeichen im Quellcode werden zu einem zusammengefügt. Zeilenumbrüche werden dargestellt, wie sie im Quelltext angegeben werden, wenn sie durch <br> erzwungen werden oder automatisch am Zeilenende. Auch dieser Wert wird erst ab CSS 2.1 hinzukommen. Inherit

Anmerkung: Der IE 6 kennt den Wert »pre« nur im Standard-Modus

Anmerkung: Die Anwendbarkeit auf "blocklevel-elemente" ist in CSS1 sowie CSS2 jeweils als Fehler markiert. Ab CSS 2.1 gilt whitespace "offiziell" für alle Elemente.

Wert