Change Mobile Breakpoint for Main Navigation

[Richard Bland]

Morning Tom,

Is there any way within the framework to change the mobile breakpoint for the main menu. This clients menu is a bit too long and needs to break into mobile view a bit sooner.

Cheers

Kind Regards,

Richard Bland
Owner, BhambraBland
--
w: www.bhambrabland.co.uk
e: richard@bhambrabland.co.uk
--

[bdbrown]

Hi Richard. Here is a related post that gives some background on this question.

[Tom]

Check out this code: https://gist.github.com/generatepress/c23aef2d05807c39bb32

It allows you to set the width at which the mobile menu CSS kicks in 🙂

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

[Craig]

This code works great…but is there any chance to have it force the logo centered? I tried adding this…

.fluid-header .inside-header, .header-widget, .site-info {
    text-align: center;
}

…but the hamburger menu / search icon don’t move down and are placed on top of each other.

[Craig]

Ah..nevermind!

Found the answer…add the following to the code linked above:

.header-aligned-left .site-header

[Tom]

Glad you got it working 🙂

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

[Author]

Posts