Archived topic
Mega Menu Width
7 replies · Started by Gary on April 7, 2020
I know this question has probably been asked several times but I was wondering if there is a way to set the CSS mega menu so that the drop downs are the same as the page width instead of the menu width? It works fine with my sticky menu but not the main menu. My website URL is http://www.christtheteacher.ca/ctt/. Any CSS tweaks would be greatly appreciated.
Thanks,
Gary
Hi there,
Try activating this option:
https://docs.generatepress.com/article/navigation-as-a-header/
Let me know if this helps :)
Hi Leo,
I activated the "Use Navigation as Header" option and that resolved the problem with the width of the mega menu. Now my header background is "white" and the logo is too large after adjusting the header height. I can't find the setting to change the header background. Do I need to create a new page header element to fix these problems?
Thanks,
Gary
Hi there,
The Navigation as Header - replaces the header with the Nav. So Customizer > Colors > Primary Navigation is where you can set them.
The logo is now defined by the Menu Item Height in Customizer > Layout > Primary Navigation. Reduce that to reduce the logo.
Or you can use this CSS to change its size independently:
.navigation-branding img {
height: 60px;
}Hi David,
Not sure how I missed the background color, thanks for pointing me in the right direction. I also used the CSS code to resize the logo and that worked great as well. Thank you so much for all the great support. I think I finally have my theme setup the way I wanted it. You guys rock when it comes to support!
Gary
Glad we could be of help
Dear GeneratePress,
I have a similar question so instead of opening up a new topic, I'm posting it here.
Similarly to OP, I'd like to change the width of my megamenu to something similar like on this site: http://www.moneyunder30.com. Their megamenu is not the full width of their site, but there is empty space/padding on both sides. See here: https://imgur.com/Q5Sh3xD
Could you please help how I can customize the width of my website similarly?
I used the Navigation-as-a-header option suggested above by Leo, but the megamenu becomes full-width which I don't want (I'd like to have spacing on both sides).
See picture: https://imgur.com/xmW0Mcu
If I tick off the Navigation-as-a-head option, then the width of the megamenu is not wide enough and my text does not fit.
Hi @crosby87,
Can you open a new topic for this? So you can use the private information text field to sure more details.(site link/s, etc).
Thank you.
