Својството word-break

Својството word-break овозможува пренесување на букви од долг збор во нова линија, ако тој збор не се вклопува во ширината на контејнерот.

Синтакса

селектор {
	word-break: break-all | keep-all | normal;
}

Вредност	Опис
`break-all`	Ги принудува долгите зборови да се пренесуваат во нова линија, ако зборот не се вклопува во контејнерот.
`keep-all`	За пренос на идеограми.
`normal`	Стандардно однесување: ако долгиот збор не се вклопува во ширината на контејнерот - тој едноставно ќе излезе надвор од неговите граници (при тоа ќе започне од нова линија).

Вредност по стандард: normal.

Во овој пример многу долгиот збор нема да се вклопи во контејнерот и ќе излезе надвор од неговите граници (при тоа ќе започне од нова линија):

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

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

А сега оние букви кои не се вклопувале, едноставно ќе се пренесат во следната линија:

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

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

својството overflow-wrap,
кое исто така овозможува пренесување на букви од долг збор во нова линија
својството hyphens,
кое вклучува пренос на зборови по слогови
својството overflow,
кое ги отсекува деловите кои излегуваат надвор од границите на блокот
тагот wbr,
кој имплементира меки преноси преку HTML
тагот br,
со кој можете присилно да го натерате текстот да се пренесе во нова линија