Управление длиной разрыва строки

Question

Я пытаюсь найти способ контролировать, как строки ломаются в списке меню, так что мы не завершаем одним словом во второй строке.

Например, у меня есть меню навигации шириной 200 пикселей. Одним из пунктов является «Реформирование городского развития & План». Врожденная, разрывы строк, как это:

Ресурсы

развития города &
План

То, что я хочу, это минимальное количество слов или символов, чтобы сломать, так что это больше похоже на это:

развития города
Ресурсы & План

Я не нахожу ничего в чистом CSS, чтобы справиться с этим, и до того, как я спустился по кроличьей рутине, мне было интересно, есть ли у кого-то что-то уже удобное.

Спасибо за любую помощь,

конфорок

Answer 1

К сожалению, нет никакого способа сделать это только с помощью CSS. Вы можете либо добавить разрыв строки вручную, либо написать функцию javascript для управления этим.

Answer 2

Поскольку у вас есть фиксированная ширина 200 на контейнере, вы можете обмануть браузер, используя левое правое заполнение, просто измерьте его с помощью веб-инспектора и добавьте отступы до разрыва на приятном пути.