Word-break xassəsi

word-break xassəsi, əgər söz konteynerin eninə sığmırsa, onun hərflərinin yeni sətirə köçürülməsinə imkan verir.

Sintaksis

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

Qiymət	İzah
`break-all`	Uzun sözlərin, əgər konteynerə sığmırsa, yeni sətirə köçürülməsini təmin edir.
`keep-all`	İeroqlifler üçün köçürmə.
`normal`	Standart davranış: əgər uzun söz konteynerin eninə sığmırsa, sadəcə onun sərhədlərindən kənara çıxacaq (eyni zamanda yeni sətirdən başlayacaq).

Susmaya görə qiymət: normal.

Bu nümunədə çox uzun söz konteynerə sığmayacaq və onun sərhədlərindən kənara çıxacaq (eyni zamanda yeni sətirdən başlayacaq):

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

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

İndi isə sığmayan həmin hərflər sadəcə növbəti sətirə köçürüləcək:

<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 xassəsi,
bu da uzun sözün hərflərinin yeni sətirə köçürülməsinə imkan verir
hyphens xassəsi,
bu sözlərin hecalara görə köçürülməsini aktivləşdirir
overflow xassəsi,
bu blokun sərhəddindən kənara çıxan hissələri kəsir
wbr teqi,
bu HTML vasitələri ilə yumşaq köçürmələri həyata keçirir
br teqi,
onun köməyi ilə mətnin yeni sətirə köçürülməsinə məcbur etmək olar