CSS свойство word-break

Свойство word-break определяет, как делать перенос на новую строку внутри слов, которые не помещаются в ширину контейнера. Знак переноса "-" при этом не появляется (используйте для этого hyphens).

CSS синтаксис

word-break: normal | break-all | keep-all | initial | inherit;

Возможные значения

ЗначениеОписание
normalИспользуются правила переноса строк по умолчанию. Как правило, в этом случае строки не переносятся или переносятся в тех местах, где явно задан перенос (например, с помощью <br>).
break-allПеренос строк добавляется автоматически, чтобы слово поместилось в заданную ширину блока. Значение не работает для текста на китайском, корейском или японском языках.
keep-allНе разрешает перенос строк в словах на китайском, корейском или японском языках. Для остальных языков действует как normal.
inheritЗначение наследуется от родительского элемента.
initialУстанавливает значение по умолчанию.

Пример использования

Устанавливаем перенос строк


p.test {
    word-break: break-all;
}