I am using BULMA css and my bottom bar is displaying correctly in mobile and tablet. But in the desktop the menus are not spaced out

<nav class="navbar is-link is-fixed-bottom">
        <div class="navbar-brand">
            <a id="menu-home-id" class="navbar-item is-expanded is-block has-text-centered has-text-weight-bold is-active" hx-get="home.html">
                <i class="fa fa-home">
                </i>
                <p class="is-size-7">
                    Home
                </p>
            </a>
            <a id="menu-catalog-id" class="navbar-item is-expanded is-block has-text-centered has-text-weight-bold" hx-get="books.html">
                <i class="fa fa-search">
                </i>
                <p class="is-size-7">
                    Catalog
                </p>
            </a>
     </div>
</nav>

bottom bar in desktop

0

There are 0 best solutions below