Navigation as header layout

Hi there,

in the example there is logo / center nav / right nav - what is to be added to the righthand side of your site?

Sorry for the late response. I want to have the layout this way

Logo (aligned left) - 3 menu items center - 2 menu items aligned right

Also I forgot to mention I am using navigation as header. And trying to make a sticky navigation.

I tried splitting the header into 3 sections, and was playing around with flex box but can't seem to get it right. Any help would be greatly appreciated.

Could you add the additional 2 menu items you want aligned right in your menu. The first of these two menu items can you add a CSS class of push-right

Adding classes to menus: https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#custom-classes

Once done i can take a look at the CSS required.

Ok I added the class but It didn't push right for some reason.

I got most of the way there but my 3 center items are not centered

Looks like you figured it out?

Hello, Im back at it again. Lost my previous site so I needed to start over. Kinda stuck in the same place as last time.

pretty much trying to accomplish a 3 column nav bar.

Can you share a link to your site so i can see where you got to ?

http://www.uicanvas.com

Hi there,

Give this CSS a shot:

@media (min-width: 769px) {
    .nav-aligned-center .main-navigation.has-branding .inside-navigation {
        justify-content: flex-start;
    }

    .nav-aligned-center .navigation-branding {
        margin-right: auto;
    }

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

    .nav-aligned-center .main-navigation ul {
        display: flex;
    }

    li#menu-item-41 {
        margin-left: auto;
    }

    .nav-aligned-center .main-navigation ul > li:first-child {
        margin-left: auto;
    }
}

Tom, you are the man! THANK YOU

You're welcome :)