@Svojest

Почему не работает hyphens?

Проблема:
Свойство hyphens работает только в Google Chrome, в остальных браузерах не работает (пробовал Safari, Firefox, Opera, YB, Edge)

Заметил, что для hyphens важно значение атрибута <html lang="ru">, и если в моём случае сменить на en, то с кириллицой перестанет работать это свойство и в Google Chrome

Так же, не удалось найти поддержку "ru" на caniuse, хоть и показывает global 98%

Может есть варианты, чтобы повторить такое поведение?
Важно чтобы перенос происходил автоматически, нельзя фиксированно указать где будет перенос, т.к если у карточки будет достаточно места, то перенос не нужен
Или всё же я что-то неверно использую?

65deb21031930512088103.jpeg

Рис. 1 Google Chrome , <html lang="ru">

65deb21ae97d3143164688.jpeg

Рис. 2 YB и у всех остальных браузерах так же, <html lang="ru">
  • Вопрос задан
  • 204 просмотра
Пригласить эксперта
Ответы на вопрос 2
delphinpro
@delphinpro Куратор тега CSS
frontend developer
Есть такие варианты

1. Предварительная подготовка текста.
1.1. Либо вручную с помощью подобных сервисов https://betravis.github.io/shape-tools/hyphenator/
1.2. Либо php-скриптом при сохранении/или выводе на страницу, вроде такого https://github.com/heiglandreas/Org_Heigl_Hyphenator
2. Использовать javascript-библиотеку для расстановки переносов, типа такой https://github.com/mnater/Hyphenopoly

нельзя фиксированно указать где будет перенос

ото&shy;ри&shy;но&shy;ла&shy;рин&shy;го&shy;ло&shy;гия
Ответ написан
Get-Web
@Get-Web Куратор тега CSS
Front-End Developer
Заметил, что для hyphens важно значение атрибута

Можно же не гадать на кофейной гуще, а просто прочитать доку https://htmlbook.ru/css/hyphens

Если не работает автоматически и текста не много, то можно расставить варианты переноса в ручную
manual - Переносы слов в тексте происходят в тех местах, 
где добавлен &shy; или <wbr>, если их нет, то переносы не делаются.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы