Īpašība word-break

Īpašība word-break ļauj pārnest gara vārda burtus uz jaunu rindu, ja šis vārds neietilpst konteinera platumā.

Sintakse

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

Vērtība	Apraksts
`break-all`	Piespiež garos vārdus pārnesties uz jaunu rindu, ja šis vārds neietilpst konteinerā.
`keep-all`	Ķīniešu, japāņu un korejiešu hieroglifu pārnešanai.
`normal`	Standarta uzvedība: ja garš vārds neietilpst konteinera platumā - tas vienkārši izkļūs ārpus tā robežas (vienlaikus sākoties no jaunas rindas).

Noklusējuma vērtība: normal.

Šajā piemērā ļoti garš vārds neietilps konteinerā un izkļūs ārpus tā robežām (vienlaikus sākoties no jaunas rindas):

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

Результат:

Bet tagad tie burti, kuri neietilpa, tiek pārnesti uz nākamo rindu:

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

Результат: