Почему у меня растягивается навигация?

Question

[Виталий]

Мне по макету нужно сделать так , но почему-то у меня получается вот так(я не могу понять что я не так делаю)
Вот код(делал с помощью флекса)

<div class="barmenu">
                   <nav class="choice">
                   <h4 class="bar__text">filter by type</h4>
                   
                   
                       <a href="#" class="ch chact">All</a>
                       <a href="#" class="ch">Web design</a>
                       <a href="#" class="ch">Mobile design</a>
                       <a href="#" class="ch">Photography</a>
                   </nav>
               </div>

.barmenu{
    width: 100%;
    margin-top: 115px;
}

.bar__text{
    text-transform: uppercase;
    color: #222;
    
    font-size: 18px;
}

.choice{
    display: flex;
    justify-content: space-between; 
    background-color: aquamarine;
    
    
}

.ch{
    color: #6c6c6c;
    font-size: 18px;
    text-transform: capitalize;
    border-right: 2px solid #999999;
    padding-right: 10px;
    
    
    background-color: aqua;
    
    
    transition: color .2s linear;
}

Answer 1

[ⓒⓢⓢ]

без песочницы не проверить, но скорее всего решит вашу проблему, если:
Для блока .bar__text добавите стиль margin-right: auto;
В блоке .choice стиль justify-content: space-between; получается уже не нужен

Comments

[Виталий]

Огромное спасибо!!! Помогло )