Element menu przeskakuje do nowej lini

html:

<nav>
            <a class="menu active" href="#">O mnie</a>
            <a class="menu" href="#">Aktualności</a>
            <a class="menu" href="#">Inspiracje</a>
            <a class="menu" href="#">Kontakt</a>
        </nav>

css:

a.menu {
    display: inline-block;
    width: 25%;
    padding: 15px 30px;
    color: white;
    text-decoration: none;
    text-align: center;

Ostatni element menu przeskakuje mi do nowej linii

Ktoś jest w stanie wytłumaczyć dlaczego tak się dzieje? Sprawdzałem w różnych przeglądarkach

otwórz to sobie w inspektorze czy innym webtoolsie, i na żywca pozmieniaj paddingi, szerokość procentową, to ci sie przy na przyszłość, będziesz bardziej świadomy tego co robisz ziom ;)

Problem rozwiązany - to przez entery między elementami w kodzie html. Pewnie są inne rozwiązania, ale usunięcie enterów też pomaga