overflow-wrap касиети

overflow-wrap касиети контейнердин туурасына сыйбаган узун сөздүн тамгаларын жаңы сапка которууга мүмкүндүк берет.

Синтаксис

тандоочу {
	overflow-wrap: break-word | normal;
}

Маани	Сүрөттөмө
`break-word`	Узун сөздөр контейнерге сыйбаса, жаңы сапка которулушуна аргасыз кылат. Бул учурда сөз жаңы саптан башталат.
`normal`	Стандарттуу аракет: эгерде узун сөз контейнердин туурасына сыйбаса - ал жөн гана анын чектеринен сыртка чыгат (бул учурда жаңы саптан башталат).

Демейки маани: normal.

Бул мисалда өтө узун сөз контейнерге сыйбайт жана анын чектеринен сыртка чыгат (бул учурда жаңы саптан башталат):

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

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

Эми сыйбаган тамгалар жөн гана кийинки сапка которулат (бул учурда узун сөз дагы эле жаңы саптан башталат):

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

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

word-break касиети,
ал дагы узун сөздүн тамгаларын жаңы сапка которууга мүмкүндүк берет
word-wrap касиети,
ал overflow-wrap касиетинин эскирген аталышы
hyphens касиети,
ал сөздөрдү муун боюнча которууну ишке киргизет
wbr теги,
ал жумшак которууларды HTML каражаттары менен ишке ашырат
br теги,
ал менен текстти мажбурлоо менен жаңы сапка которсо болот