hyphenate-limit-chars
Одно из недавних моих открытий в мире CSS-спецификаций. Думаю, про свойство
Но, оказывается, есть ещё одно полезное свойство, которое не даёт браузеру переносить слишком короткие слова. Если записать
- не переноси слова, которые короче 10 символов;
- при переносе оставляй на первой строке не меньше 4 символов;
- при переносе оставляй на второй строке не меньше 3 символов.
Можно написать короче,
Хоть и пользуюсь автопереносами в вебе я редко, там, где всё-таки пользуюсь, мне этот маленький файнтюнинг прям будет полезен. Да, только для Chromium-браузеров, но прогрессивное улучшение никто не отменял.
https://developer.mozilla.org/en-US/docs/Web/CSS/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