[Resolved] Main navigation location middle/center

[Michael]

Hi guys

I am struggling to align the primary navigation horizontally centered.
Tried several options via navigation location and navigation alignment where there is no option to put it in the middle.

The goal is that all menu items are in the middle (except “Join us” should remain aligned right).

How do I achieve that?
Any help is much appreciated.

Thanks in advance
Michael

[Leo]

Hi there,

So basically a header/navigation layout like Target?
https://gpsites.co/target/

If so Target is using this option:
https://docs.generatepress.com/article/navigation-as-a-header/

With this CSS:

/* Primary navigation styles */
.main-navigation:not(.slideout-navigation) .main-nav {
    flex-grow: 1;
}

.main-navigation .main-nav {
    text-align: center;
}

@media (min-width: 769px) {
    .nav-aligned-right .main-navigation .menu li.nav-button {
        float: right !important;
    }
}

[Michael]

Thanks Leo – that helps a lot!

[Leo]

No problem 🙂

[Author]

Posts