Текст меню длинный перерыв - соответствует следующей строке - PullRequest
Новая
       10

Текст меню длинный перерыв - соответствует следующей строке

0 голосов
/ 07 декабря 2018

У меня есть меню, и есть пункт, где текст должен быть длинным и сломанным.Как вторая строка может соответствовать вышеупомянутому?

<ul class="sidr-class-sub-menu" style="display: block;">
    <li id="sidr-id-menu-item-14176" class="sidr-class-menu-item sidr-class-menu-item-type-post_type sidr-class-menu-item-object-page sidr-class-menu-item-14176"><a href="https://wave-akademie.de/fb-medien/">FB MEDIEN ÜBERSICHT</a></li>
    <li id="sidr-id-menu-item-14146" class="sidr-class-menu-item sidr-class-menu-item-type-post_type sidr-class-menu-item-object-page sidr-class-menu-item-14146"><a href="https://wave-akademie.de/ausbildung/musik-und-medienmanagement/">MUSIK- UND MEDIENMANAGEMENT<i class="sidr-class-menu-item-desc">(Staatlich anerkannt)</i></a></li>
</ul>

enter image description here

Ответы [ 3 ]

0 голосов
/ 07 декабря 2018

Вы можете добавить white-space: nowrap; к элементам li.Это поможет предотвратить их обертывание.

0 голосов
/ 07 декабря 2018

Если вы хотите предотвратить разрыв второго элемента списка, используйте следующее: 

ul { 
  white-space: nowrap;
 }
0 голосов
/ 07 декабря 2018

Если вы хотите, чтобы вторая и первая строки были на одной строке, например.

MUSIK-UND MEDIENMANGEMENT

Что-то, что вы можете попробовать?

  1. Расширить контейнер
  2. Уменьшить текст (уменьшить межбуквенный интервал или размер шрифта и т. Д.)
  3. Добавить свойство переполнения (сделать его многоточием или скрыть не подходящие буквы))
  4. Добавьте минимальную ширину к контейнеру, чтобы он не мог сжиматься после определенной ширины
...