Omadus overflow-wrap

Omadus overflow-wrap võimaldab pika sõna tähed uuele reale paigutada, kui see sõna ei mahu konteineri laiusesse.

Süntaks

cssselektor {
  overflow-wrap: break-word | normal;
}

Väärtus	Kirjeldus
`break-word`	Sunni pikad sõnad ümber paigutama uuele reale, kui see sõna ei mahu konteinerisse. Sel juhul algab sõna uuest realt.
`normal`	Standartne käitumine: kui pikk sõna ei mahu laiuses konteinerisse - see lihtsalt ulatub välja selle piiridest (kuid algab siiski uuest realt).

Vaikeväärtus: normal.

Selles näites väga pikk sõna ei mahu konteinerisse ja ulatub välja selle piiridest (kuid algab uuest realt):

html<div id="elem">
  Lorem ipsum dolor sit amet
  loooooooooooooooooooooooooooooooongword,
  consectetur adipiscing elit.
</div>

css#elem {
  word-wrap: normal;
  overflow-wrap: normal;
  border: 1px solid red;
  width: 200px;
}

Результат:

Nüüd need tähed, mis ei mahtunud, paigutatakse lihtsalt järgmisele reale (kuid pikk sõna algab ikkagi uuest realt):

html<div id="elem">
  Lorem ipsum dolor sit amet
  loooooooooooooooooooooooooooooooongword,
  consectetur adipiscing elit.
</div>

css#elem {
  overflow-wrap: break-word;
  border: 1px solid red;
  width: 200px;
}

Результат: