Die overflow-wrap Eienskap

Die overflow-wrap eienskap laat toe dat die letters van 'n lang woord na 'n nuwe reël oorgedra word, as daardie woord nie in die houer se wydte pas nie.

Sintaksis

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

Waardes

Standaardwaarde: normal.

Voorbeeld . Waarde normal

In hierdie voorbeeld sal 'n baie lang woord nie pas in die houer nie en sal oor sy grense uitsteek (en sal terselfdertyd op 'n nuwe reël begin):

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;
}

Результат:

Voorbeeld . Waarde break-word

En nou sal daardie letters wat nie gepas het nie, eenvoudig na die volgende reël oorgedra word (en sal die lang woord steeds op 'n nuwe reël begin):

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;
}

Результат:

Sien ook