Proprietatea word-break

Proprietatea word-break permite transferarea literelor unui cuvânt lung pe o linie nouă, dacă acel cuvânt nu încape în lățimea containerului.

Sintaxă

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

Valoare	Descriere
`break-all`	Forțează cuvintele lungi să se transfere pe o linie nouă, dacă acel cuvânt nu încape în container.
`keep-all`	Pentru transferarea hieroglifelor.
`normal`	Comportamentul standard: dacă un cuvânt lung nu încape în lățimea containerului - acesta va ieși pur și simplu în afara limitei acestuia (însă va începe pe o linie nouă).

Valoarea implicită: normal.

În acest exemplu, un cuvânt foarte lung nu va încăpea în container și va ieși în afara limitelor acestuia (însă va începe pe o linie nouă):

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

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

Acum, acele litere care nu încăpeau, vor fi pur și simplu transferate pe linia următoare:

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

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

proprietatea overflow-wrap,
care permite, de asemenea, transferarea literelor unui cuvânt lung pe o linie nouă
proprietatea hyphens,
care activează transferarea cuvintelor pe silabe
proprietatea overflow,
care taie părțile care ies în afara limitei blocului
tag-ul wbr,
care implementează transferuri moi folosind HTML
tag-ul br,
cu ajutorul căruia puteți forța transferarea textului pe o linie nouă