Как выровнять иконки в шапке сайта?

Question

[arbitino]

Здраствуйте, делал шапку сайта и столкнулся с проблемой, что основное лого сайта расположено не наравне с другими иконками, иконки взяты с fontawesome.com . Вот код html

<header class="my_header">

                <nav class="header__links">
                    <a href="" class="">
                        <img src="/public/img/shortLogo.png" alt="">
                    </a>
                    <a href="" class="header__link"><i class="fas fa-question"></i></a>
                    <a href="" class="header__link"><i class="fas fa-users"></i></a>
                    <a href="" class="header__link"><i class="fas fa-images"></i></a>
                    <a href="" class="header__link"><i class="far fa-list-alt"></i></a>
                    <a href="" class="header__link"><i class="fas fa-sign-out-alt"></i></a>
                </nav>

        </header>

Вот код css:

.my_header{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

.header__links{
    margin-top: 100px;

}
.header__link{
    padding: 20px;
    font-size: 40px;
}

margin и padding'и помогают только с отступами по горизонтали, но никак не влияют на отступы по вертикали, в чем может быть проблема и как ее можно решить?
Вот скриншот:

Comments

[Aspirant555]

добавь flex внутри header__links, и ровняй.

Answer 1

[Виталий Першин]

margin и padding'и помогают только с отступами по горизонтали, но никак не влияют на отступы по вертикали, в чем может быть проблема и как ее можно решить?

Потому что вы пытаетесь их применять к инлайновым элементам, чтобы это было возможно задайте header__link к примеру display: inlnie-block