Archived topic
Bring Search Bar to the left of the menu (Secondary navigation)
5 replies · Started by Clémence on June 8, 2022
Hi team,
I've just switched the search bar to the secondary navigation as explained in your article and now I would like to switch it to the left of the secondary menu so that when we click it it doesn't overlap with the menu.
I've tried to look through the forum but I'm not quite sure how to do it. Let me know if you can help!
Best,
Clemence
Hi there,
try adding this CSS:
@media(min-width: 769px) {
.secondary-navigation {
width: 100%;
}
.secondary-navigation .main-nav {
order: 10;
margin-right: unset;
}
.secondary-navigation .navigation-search {
position: relative;
width: auto;
margin-right: 0;
}
}Awesome, it works perfectly!
And just to double check before I add custom CSS, the height of the search bar cannot be set in the customizer, right?
Cheers,
Clemence
No it cannot be set in the Customizer it requires CSS.
Let us know if you need assistance with that.
Noted,
This is thankfully in my skillset haha, thanks for the help!
Glad to be of help :)
