Site logo

Archived topic

Mobile Menu Adjustments

8 replies · Started by Robert on June 26, 2018

Viewing posts 1–9 of 9

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!

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;
}

Thank you both!

Glad we could help :)

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.

Hmm the code should work.

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

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.

No problem :)

This archived topic is closed to new replies.