[Resolved] Hamburger menu left side (sticky navigation)

[Kévin]

Hello,

I’m trying to put the hamburger menu on the left side on the bar when i’m scrolling (sticky nav), but i didn’t find the answer.

I want “Form. de commandes” and “Contact” stay on the right side, but the hamburger on the left side, to the right of the logo.

Can you help ?

Thank’s

[Leo]

Hi there,

Try this CSS:

.main-navigation.has-sticky-branding.navigation-stick .menu-toggle {
    order: 1 !important;
    margin-right: auto;
    margin-left: -10px;
}
.nav-aligned-left .navigation-stick .navigation-branding {
    margin-right: 0;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

Keep in mind that there might not be enough room for all 4 items to stay in one line on a smaller mobile screen.

Let me know if this helps 🙂

[Kévin]

Hey Leo,

Thank’s a lot. It works !
I hided the logo on vertical mobile screen.

1. The hamburger menu is not placed far left on the sticky nav.

Do you know how to fix it ?

2. On horizontal mobile screen, i want the hamburger menu next to the logo on the right and not align right.Is it understandable ?

Have a nice day.

[Leo]

Try this here:
https://generatepress.com/forums/topic/hamburger-menu-left-side-sticky-navigation/#post-1188277

[Kévin]

Hey Leo,

It’s soon perfect, thank’s for your help and speed.

On vertical mobile screen, the hamburger moves a bit on the right side when scrolling.

Regards

[Leo]

Don’t think I’m seeing the issue:
https://www.screencast.com/t/Nc5v1015

Am I missing something here?

Let me know 🙂

[Kévin]

Thank you for your answer.

It’s when the window is smaller

Look at this: https://www.screencast.com/t/eemIrKxQ

Btw thank’s for screencast and snagit didn’t know them 😉

[Leo]

Try this CSS here:
https://generatepress.com/forums/topic/hamburger-menu-left-side-sticky-navigation/#post-1188277

[Kévin]

Yeah,

Thank you dude.
You’re a chief.

Good afternoon.

[Leo]

No problem 🙂

[Author]

Posts