Test white-space: pre, normal, nowrap, pre-wrap

Text se zachovanými mezerami pomocí tagu <pre>

120       koní
 78       ovcí
 34       psů
  2       lidi

Text se zachovanými mezerami pomocí stylu white-space: pre. Aby sloupečky zařezávaly, musel by se ještě nastavit nějaký monospace font.

     koní
     ovcí
     psů
     lidi

Tentýž text bez zachovaných konců řádků pomocí stylu white-space: normal. Normal se chová jako normální HTML a všechny sekvence bílých znaků nahradí mezerou:

120 koní 78 ovcí 34 psů 2 lidi

Tentýž text bez zachovaných konců řádků pomocí stylu white-space: nowrap;:

120 koní 78 ovcí 34 psů 2 lidi

White-space: pre; zachová řádky, ale neumí rozdělit dlouhý řádek, takže řádek vyjde příliš dlouhý:

Na divokých kolech
	smrduté Čertovky
		ulpývaly tiše
			mračna a chuchvalce
				sinicemi plných 
					zelenkavých vláken.

To jak tam milenci, teďko už samotní, štípali zámečky, klíčky už ztratili, že nevěřili už, že budou potřeba, ach běda jó běda.

Ptáš se, kde brala se,
	vlákna ta zelená,
		ulívat na nich že
			sinice zvládaly?
				To jak jim kanuly 
					ze rtů či od vousů
						sliny a plivance
							bídy a nelásky
								čertovské nevěry.
									Čertovku plnily.

Vyřeší se to pomocí white-space: pre-wrap; zachová odsazení a zároveň dlouhý řádek rozdělit umí. Musí v něm mít mezery, což v tomto příkladu má:

Na divokých kolech
	smrduté Čertovky
		ulpývaly tiše
			mračna a chuchvalce
				sinicemi plných 
					zelenkavých vláken.

To jak tam milenci, teďko už samotní, štípali zámečky, klíčky už ztratili, že nevěřili už, že budou potřeba, ach běda jó běda.

Ptáš se, kde brala se,
	vlákna ta zelená,
		ulívat na nich že
			sinice zvládaly?
				To jak jim kanuly 
					ze rtů či od vousů
						sliny a plivance
							bídy a nelásky
								čertovské nevěry.
									Čertovku plnily.

white-space: pre je závislý na strikním doctype. Tato stránka má striktní doctype, aby bylo něco vidět. Např. <!DOCTYPE HTML> je striktní doctype a Internet Explorer white-space: pre akceptuje. Oproti tomu <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> je přechodové doctype a Internet Explorer white-space: pre ignoruje.

Příklad se vztahuje k výkladu vlastnosti white-space.