Как вставить «символ новой строки» в пункт меню? - PullRequest
0 голосов
/ 29 октября 2019

Я использую угловой материал. Мне нужно создать меню, где один из пунктов состоит из двух больших абзацев. Текст обрезается, и появляется только первый абзац.

Кто-нибудь может помочь? Ссылка на код: https://stackblitz.com/edit/angular-mat-menu-item-newline

Спасибо.

1 Ответ

1 голос
/ 29 октября 2019

Мне удалось сделать это, выполнив две вещи:


  • Сначала добавьте CSS, описанный в https://stackblitz.com/edit/angular-qzbutg?embed=1&file=app/menu-overview-example.css:

    :: ng-deep button.mat-menu-item {-webkit-user-select: none;-moz-user-select: нет;-ms-user-select: нет;выбор пользователя: нет;курсор: указатель;контур: 0;граница: нет;-webkit-tap-highlight-color: прозрачный;пустое пространство: nowrap;переполнение: скрытое;переполнение текста: многоточие;дисплей: блок;/ ** установить высоту строки на желаемую высоту * / line-height: 18px;/ ** установить высоту на авто * / высота: авто;отступы: 0 16px;выравнивание текста: слева;текстовое оформление: нет;максимальная ширина: 100%;положение: относительное;}


  • Второй: вместо одной кнопки с символами новой строки, которые не поддерживаются в HTML, я создал две кнопки спервый с отступом в 12 пикселей для подделки нового абзаца.
...