primeng p-боковая панель - значок закрытия, перекрывающий текст содержимого

#html #css #angular #primeng

#HTML #css #угловой #primeng

Вопрос:

Согласно выводам вышеупомянутого редактора, могу ли я каким-либо образом избежать наложения текста на значок закрытия? Я не хочу переносить текст на следующую строку. Из инструментов разработчика я узнал, что стиль кнопки закрытия как {position: absolute; top:0; right:0;}

Я пытался использовать word-wrap: break-word , но это не сработало.

Ответ №1:

 .p-sidebar-close {
    position: relative;
    float: right;
}

Переопределите или измените свойства CSS .p-sidebar-close position: relative; и float: right;

1. изменение width или margin div приведет к изменению других строк, я хочу, чтобы приведенные ниже строки были расположены в конце боковой панели.

2. Принял ваш ответ, но почему-то он не работает в моем проекте. Кнопка закрытия после добавления изменений теперь отображается на одну строку выше div. Я не могу воспроизвести в stackblitz.

3. Я вижу ваш файл CSS. Подключен ли к нему ваш компонент? Похоже, это не так.

4. В app.component.ts замените styles на styleUrls: ["./app.component.css"]

5. Все в порядке, я проверил это в инструментах разработчика.