Site logo

Archived topic

2 navigation inline

7 replies · Started by Erwin on October 17, 2021

Viewing posts 1–8 of 8

Hi, can you please help me to create 2 navigations inline? For example check: https://evernote.com/intl/en
1 navigation next to logo (float to the left) and 1 navigation (float to the right)

2 horizontal nav

Hi there,

can you share a link to your site so i can see the layout - i can then advise on how to do that.

Hi David, v2.ontgoogelen.nl

Try adding this CSS:

@media(min-width: 769px) {
    #site-navigation,
    #primary-menu {
        flex: 1;
    }

    .main-navigation li.push-right {
        margin-left: auto;
    }
}

Then give the first menu item that is aligned right a CSS Class of: push-right
For example, in the screenshot you shared that would be the Help menu item.
This doc explains adding Classes to menu items:

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

Thanks, checkout what's happening if you use more then 1 nav item.

You only need to add the class to one menu item. The CSS pushes that item and any item after it to the right.

Cool! Thanks

Glad to be of help!

This archived topic is closed to new replies.