hyphenate-limit-chars



Одно из недавних моих открытий в мире CSS-спецификаций. Думаю, про свойство hyphens: auto, которое включает перенос на новую строку для длинных слов, вы знаете. Точнее, просит браузер, если у него есть правильные словари, включить эти самые переносы. Использую редко, потому что мне в целом не нравится, когда в веб бездумно переносят то же самое, что есть на бумаге.



Но, оказывается, есть ещё одно полезное свойство, которое не даёт браузеру переносить слишком короткие слова. Если записать hyphenate-limit-chars: 10 4 3, то вы говорите браузеру:

- не переноси слова, которые короче 10 символов;

- при переносе оставляй на первой строке не меньше 4 символов;

- при переносе оставляй на второй строке не меньше 3 символов.



Можно написать короче, hyphenate-limit-chars: 10, если вам важен контроль только над длиной слов.



Хоть и пользуюсь автопереносами в вебе я редко, там, где всё-таки пользуюсь, мне этот маленький файнтюнинг прям будет полезен. Да, только для Chromium-браузеров, но прогрессивное улучшение никто не отменял.



https://developer.mozilla.org/en-US/docs/Web/CSS/hyphenate-limit-chars