Site logo

Archived topic

Issue on GP Beta 3 with niche theme centering logo and having menu in left+right

7 replies · Started by Adrien on September 10, 2020

Viewing posts 1–8 of 8

Hello,

Im trying to center my logo and make the primary menu spread on left and right using a menu custom link separator with the css class as menu-item-separator.

I have followed all instructions in this article: https://docs.generatepress.com/article/centering-logo-navigation/

However it does not seem to work.

Would appreciate your help there. Thank you very much. Adrien

Hi there,

can you disable your cache, and remove the Split Nav CSS so i can provide some new CSS.

Hey David, Thanks a lot. I have disabled the cache and removed the split nav CSS code.

Stole this CSS from David a while back, worth a shot:

@media (min-width: 769px) {
    .navigation-branding {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        z-index: 1000;
        text-align: center;
    }

    .main-nav {
        margin-left: unset;
        flex-basis: 100%;
    }

    .main-navigation li:nth-child(2) {
        margin-right:auto;
    }

    .main-navigation .inside-navigation {
        flex-wrap: nowrap;
    }
}

Let us know :)

;-) Thanks a lot Tom. Actually it almost worked. Here is how it looks like:

https://tinyurl.com/yyhq48ny

It seems the menu custom link separator with the css class as menu-item-separator does not work.

Appreciate all your fantastic support.

You can actually just remove that menu item separator - it's not necessary with this code.

Then you can fix the cart menu item with this:

.menu-bar-items {
    flex-shrink: 0;
}

Tom thanks a ton! It worked perfectly ;-)

Awesome, glad I could help :)

This archived topic is closed to new replies.