Właściwość word-break

Właściwość word-break umożliwia przeniesienie liter długiego słowa do nowego wiersza, jeśli to słowo nie mieści się w szerokości kontenera.

Składnia

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

Wartość	Opis
`break-all`	Wymusza przenoszenie długich słów do nowego wiersza, jeśli słowo nie mieści się w kontenerze.
`keep-all`	Do przenoszenia znaków ideograficznych.
`normal`	Standardowe zachowanie: jeśli długie słowo nie mieści się w szerokości kontenera - po prostu wystanie poza jego granice (przy czym zacznie się od nowego wiersza).

Wartość domyślna: normal.

W tym przykładzie bardzo długie słowo nie zmieści się w kontenerze i wystanie poza jego granice (przy czym zacznie się od nowego wiersza):

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

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

A teraz te litery, które się nie mieściły, po prostu zostaną przeniesione do następnego wiersza:

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

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

właściwość overflow-wrap,
która również umożliwia przeniesienie liter długiego słowa do nowego wiersza
właściwość hyphens,
która włącza przenoszenie słów według sylab
właściwość overflow,
która przycina części wystające poza granice bloku
znacznik wbr,
który realizuje miękkie przenoszenia za pomocą HTML
znacznik br,
za pomocą którego można wymusić przeniesienie tekstu do nowego wiersza