Не могу расположить правильно текст

Вот так выглядит сам код в style.css, может тут что не так.

@media (min-width: 992px) {
    .tm-main-nav {
        display: flex ;
        justify-content: space-around;
    }
    .tm-top-column { 
        position: block; 
        height: 100%;
    }

А так все выглядит на основной странице

 <nav class="tm-main-nav">
    <ul class="tm-main-nav-ul">
    <li class="tm-nav-item">
    <a href="#ward" class="tm-nav-item-link">О палате</a>
    </li>
    <li class="tm-nav-item">
    <a href="#applicants" class="tm-nav-item-link">Претендентам</a>
    </li>
    <li class="tm-nav-item">
    <a href="#members" class="tm-nav-item-link">Членам палаты</a>
    </li>
    <li class="tm-nav-item">
    <a href="#registry" class="tm-nav-item-link">Реестр</a>
    </li>
    <li class="tm-nav-item">
    <a href="#patrial" class="tm-nav-item-link">Гражданам</a>
    </li>
    <li class="tm-nav-item">
    <a href="#training" class="tm-nav-item-link">Обучение</a>
    </li>
    <li class="tm-nav-item">
    <a href="#contact" class="tm-nav-item-link">Контакты</a>
    </li>
    </ul>
    </nav>