Lastnost word-break

Lastnost word-break omogoča prelom črk dolge besede v novo vrstico, če ta beseda ne sodi v širino posoda.

Sintaksa

cssselektor {
  word-break: break-all | keep-all | normal;
}

Vrednost	Opis
`break-all`	Prisili dolge besede, da se prelomijo v novo vrstico, če beseda ne gre v posoda.
`keep-all`	Za prelom hieroglifov.
`normal`	Standardno vedenje: če dolga beseda ne sodi po širini v posodo - bo preprosto šla čez njeno mejo (pri tem se bo začela z novo vrstico).

Privzeta vrednost: normal.

V tem primeru se zelo dolga beseda ne bo prilegala v posodo in šla čez njeno mejo (pri tem se bo začela z novo vrstico):

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

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

Результат:

Zdaj pa se bodo tiste črke, ki niso šle, preprosto prelomile v naslednjo vrstico:

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

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

Результат:

lastnost overflow-wrap,
ki prav tako omogoča prelom črk dolge besede v novo vrstico
lastnost hyphens,
ki vklopi prelom besed po zlogih
lastnost overflow,
ki odreže dele, ki segajo čez mejo bloka
oznaka wbr,
ki implementira mehke prelome s pomočjo HTML
oznaka br,
s katero lahko prisilimo prelom besedila v novo vrstico