make menu navigation at the center on float right nav location

Hi Willya,

Can you try adding this through Appearance > Customize > Additional CSS?:

header.site-header .inside-header nav:not(.mobile-menu-control-wrapper) {
    flex-grow: 1;
}

header.site-header .inside-header div#primary-menu {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

header.site-header .inside-header .inside-navigation {
    position: static;
}

header.site-header .inside-header .inside-navigation .menu-bar-items {
    margin-left: auto;
}

Hi Fernando,

Thank you for your help. The CSS code you provide is work!

Ah, I notice that my sticky navigation is hidden when I scroll the page to the section of dark background (perhaps because I set the container outer index to 99). How to make fix it?

Do you need it at a z-index of 99? If not, you can revert it to 1. That should resolve the issue.

Yes, I revert it to 1 and that resolved the issue. Thanks again!

You're welcome, Willya!

Fernando, I forgot something. I see that in other pages, the main navigation is not on the center. its is center, but only on homepage. Is it because I use transparent header on homepage so that the CSS class/ID on other pages perhaps different so that the code not works?

Yes, my code is intended for the structure of the homepage only.

I updated the code I provided above now. Can you try that instead?

That should work for all pages I believe.

Wow! Glad to be part of the GP family : )
You are my favorite support, Fernando.

You're welcome, Willya! :)