Как настроить выравнивание ссылок на панели навигации в уменьшенном виде в Bootstrap 5 ⇐ CSS

[Anonymous]

Ранее я задавал здесь вопрос о навигационной панели Bootstrap 5:
Отрегулируйте высоту навигационной панели, чтобы она была меньше
и я получил ответы, которые были полезный. Спасибо. У меня есть дополнительный вопрос:
Я хотел бы изменить выравнивание ссылок в уменьшенном виде.
Это то, что у меня есть. :

Код: Выделить всё

[url=/]

Portfolio
[/url]

[list]
[*][url=#]About[/url]
[*][url=#]PowerPoint[/url]
[*][url=#]Infographics[/url]
[*][url=#]Logos and Icons[/url]
[*][url=#]Web Design[/url]
[*][url=#]Blog[/url]
[/list]

Вот как это выглядит сейчас:
[img]https://i.stack. imgur.com/ppDiB.jpg[/img]

Я бы хотел, чтобы это выглядело так:


Я пробовал использовать отдельный файл CSS для наименьшего представления:

Код: Выделить всё

@media (min-width: 0px) {
.nav-link-powerpoint{
margin-top: 5px;
margin-left: 86px;
}

.nav-link-infographic {
margin-top: 5px;
margin-left: 39px;
}

Горизонтальное выравнивание было исправлено:
[img]https://i.stack. imgur.com/HyPzt.jpg[/img]

но теперь, похоже, в этом разделе переопределяется вертикальное выравнивание и text-decoration-none:

Код: Выделить всё

Есть ли способ выровнять его по вертикали вот так (красная линия показывает выравнивание):


Но без подчеркивания ссылок. Есть ли лучший способ сделать это?
Спасибо,

Подробнее здесь: https://stackoverflow.com/questions/783 ... ootstrap-5