Test CSS vlastnosti word-wrap a overflow-wrap
Word-wrap dříve fungoval pouze v Exploreru. Postupem času začal fungovat v jiných prohlížečích a byl nahrazen vlastností overflow-wrap.
Tento oddíl má nastaveno word-wrap: break-word;
Velicedlouhéslovoslovoslovoslovoslovoblablablaslovopokračujeneustálepokračujejednodlouhéslovoblablablaaještěchvíliještějedenkousektextuabudemepomalukončittadykončíteď!
A pokračují další slova, aby bylo vidět, že jak se následující text láme a jak
si poradí s nejneobhospodařovávatelnějšími slovy. Je vidět, že text se
zachovává, ale dlouhé slovo se zlomí.
Tento oddíl nemá nic nastaveno nijak.
Velicedlouhéslovoslovoslovoslovoslovoblablablaslovopokračujeneustálepokračujejednodlouhéslovoblablablaaještěchvíliještějedenkousektextuabudemepomalukončittadykončíteď!
A pokračují další slova, aby bylo vidět, že jak se následující text láme a jak
si poradí s nejneobhospodařovávatelnějšími slovy. Je vidět, že dlouhé
slovo rozšíří prvek.
Tento oddíl má nastaveno word-break: break-all;
Velicedlouhéslovoslovoslovoslovoslovoblablablaslovopokračujeneustálepokračujejednodlouhéslovoblablablaaještěchvíliještějedenkousektextuabudemepomalukončittadykončíteď!
A pokračují další slova, aby bylo vidět, že jak se následující text láme a jak
si poradí s nejneobhospodařovávatelnějšími slovy. Je vidět, že dlouhé
slovo se sice zlomí, ale zlomí se i krátká slova.
Tento oddíl má nastaveno synonymní znění overflow-wrap: break-word;
Velicedlouhéslovoslovoslovoslovoslovoblablablaslovopokračujeneustálepokračujejednodlouhéslovoblablablaaještěchvíliještějedenkousektextuabudemepomalukončittadykončíteď!
A pokračují další slova, aby bylo vidět, že jak se následující text láme a jak
si poradí s nejneobhospodařovávatelnějšími slovy. Je vidět, že text se
zachovává, ale dlouhé slovo se zlomí.
Tento oddíl má nastaveno overflow-wrap: anywhere;
Velicedlouhéslovoslovoslovoslovoslovoblablablaslovopokračujeneustálepokračujejednodlouhéslovoblablablaaještěchvíliještějedenkousektextuabudemepomalukončittadykončíteď!
A pokračují další slova, aby bylo vidět, že jak se následující text láme a jak
si poradí s nejneobhospodařovávatelnějšími slovy. Je vidět, že text se
zachovává, ale dlouhé slovo se zlomí.
Pro detailní pochopení příkladu si prosím zobrazte zdroj.
CSS příklady