Скриншот того, как это выглядит после исправления:

Демонстрация JSFiddle
Обратите внимание, что такое поведение не наблюдается в Firefox и Safari, как указано Ry- в комментариях! Пока что это проблема Chromium
Скажем, у меня есть что-то подобное в достаточно маленьком контейнере, который заставляет его частично обернуться:
Код: Выделить всё
Nihongo | 日に本ほん語ご
Нихонго |日
本語
Если я удалю это место и оно будет выглядеть так:
Код: Выделить всё
Nihongo |日に本ほん語ご
Нихонго |日本
語
Если у меня есть без элемента (бессмысленно, я знаю), этой проблемы не возникает:
Код: Выделить всё
Nihongo | 日本語
本語
Изначально я ожидал, что это проблема с небуквенно-цифровым текстом, но, поигравшись в JSFiddle Я узнал, что виноват сам . Такое же поведение происходит, даже если я делаю следующее:
Код: Выделить всё
日ni本hon語go
日本語
ninihonhongogo
Мне удалось обойти эту проблему, используя в качестве псевдо-
Код: Выделить всё
(не совсем актуально, но я также пытался использовать Javascript для уменьшения размера шрифта, если его ширина длиннее контейнера, хотя на мой вкус, это было немного дороговато.)
Я пробовал читать документацию W3C по , но видел только пояснения о том, как работают пробелы внутри Структура , а не внешняя (и документация немного выше моего понимания).
Упрощенные изображения:
Это что я получаю
Что я ожидал
Наиболее близкое к тому, что мне удалось избежать проблемы ( кроме псевдометода) использует вместо обычного пробела, но это создает новую проблему если весь японский текст переносится; перед обернутым текстом на японском языке появляется предшествующий пробел, например:
Нихонго |
日本語
Подробнее здесь: https://stackoverflow.com/questions/791 ... sually-col