Right float Menu to mobile menu

[Giovanni van Heusden]

Hi Tom,

I think GP is the best!

I have a question though.

My menu is floating to the right next to the logo. On 1100px it looks great, but when the screenwidth reduces the menu gets above the logo. Is there a setting to change the menu to the mobile icon instead of going above the logo. Also can the Mobile menu when displayed on a smartphone be positioned under the logo? Last question: can the white space between the menu items in the sticky menu be adjusted?

Thaks,
Giovanni

[Tom]

Hi there,

You can initiate the mobile menu at your desired width with this CSS: https://gist.github.com/generatepress/c23aef2d05807c39bb32

Just change the 768px to whatever width you need it to initiate at.

To make the navigation appear below the logo on mobile, you can add this CSS:

@media (max-width: 768px) {
    .inside-header {
        display: flex;
        flex-flow: column;
    }
    .site-logo {
        order: 1;
    }
    .main-navigation {
        order: 2;
    }
}

There shouldn’t be any white space between menu items – can you link me to the site possibly?

Thanks!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Giovanni van heusden]

Hi Tom,

Thanks, the changes worked!
Can I send the link of the website to your generate press mailaddress?
I have one other question as well, would like to attach an image to show you.

Thanks again,
Giovanni

[Tom]

Absolutely – send away 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Evandro Arruda]

Hi Tom,

Still on this topic, is it possible to have a mobile header like yours (https://generatepress.com)?

Logo + Menu “floating” right on mobile. This makes the design a lot cleaner in my opinion.

Ps.: I’m buying you a small coffee for helping me with a few things this week. Brazil’s currency is not doing so well, I wish I could contribute with more.

Thanks a lot

[Tom]

Thanks for the coffee!

It’s tricky because of the way the default mobile menu works – it would involve re-structuring it.

It works nicely with the slideout menu though, so I may just add it as an option when the slideout menu is activated.

For now, this should help: https://generatepress.com/forums/topic/mobile-menu-right-and-logo-left/#post-152457

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts