[Resolved] Mobile Menu Adjustments

[Robert]

I’d like to accomplish two things on my mobile navigation menu.

1. Adjust the menu item height independent of the site header. Right now, changing the menu height also changes the site header.

2. Move the Navigation Search within the mobile menu.

Thanks!

[Leo]

Hi there,

1. This should help: https://generatepress.com/forums/topic/menu-item-width/#post-596935

2. Don’t think it’s possible but will check with Tom 🙂

[Tom]

Give this a shot:

.main-navigation.toggled .menu li.search-item {
    display: block !important;
}

.toggled .navigation-search,
.toggled .navigation-search input {
    height: 85px;
    bottom: 0;
    top: auto;
}

#mobile-header span.search-item {
    display: none;
}

[Robert]

Thank you both!

[Tom]

Glad we could help 🙂

[Robert]

Sorry I was premature in closing this. I’m still unable to get the first issue working – adjust the menu item height independent of the site header. Right now, changing the menu height also changes the site header.

I added the CSS indicated in but changing the menu item height still affects both the menu height and the site header.

Not sure what I’m doing wrong.

[Leo]

Hmm the code should work.

Can you turn off autopitmize so I can see the source?

[Robert]

Hi Leo,

Sorry for the confusion. It’s working. I got thrown by expecting Customizer to show me the change on the fly. It didn’t. But once I published the change and viewed the site again, it came up correctly. Thank you for your patience.

[Leo]

No problem 🙂

[Author]

Posts