Word-break: keep-all или пара слов о дефисах и переносах

Суть: word-break: keep-all не даст перенести на новую строку составное слово с дефисом.


Работал над размещением на сайте ассортимента нейтрального оборудования.

В заголовке каждой позиции присутствует модель оборудования с дефисом, например: «Стол производственный, СПО-400/600-э „Эконом“ (арт. 2000)».

В некоторых случаях это приводило к нежелательным переносам: я считаю, что для облегчения восприятия обозначение модели не должно переноситься.

Поначалу я простейшей автозаменой заменил все дефисы в нужной ячейке базы данных на неразрывные дефисы. И было всё хорошо пока не понял, что хорошо бы уметь искать по модели, скопировав её из документов. А для поиска на сайте дефис и неразрывный дефис — два разных символа.

Решением стало использование css-правила word-break: keep-all для заголовков карточек.

Свойство word-break указывает где будет установлен перенос если слово не поместится в заданной области.

Значение keep-all не разрешает переносить строки на китайском, корейском или японском языках, а для остальных языков действует как normal. Однако, хоть я и пишу по-русски, но мою проблему это значение помогло решить.

Пост опубликован 24 июля 2020 года в 19:00

#верстаю