word-break касиети

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

Синтаксис

cssтандоочу {
  word-break: break-all | keep-all | normal;
}

Маанилери

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

Мисал . Normal мааниси

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

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

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

Результат:

Мисал . Break-all мааниси

Эми сыйбаган тамгалар жөн эле кийинки сапка которулат:

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

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

Результат:

Ошондой эле караңыз