Archived topic
help needed moving search icon in the nav menu
4 replies · Started by Michael on December 24, 2020
Hello,
I was able to move the seach icon from right to left using this css:
.main-navigation .menu-bar-items {
order: -1;
}
My problem is that part of the search box is blocked. You can try using the search in the nav bar here https://app-5fd72a84c1ac1813f431cd4e.closte.com/
I can't figure out how to fix it.
thanks
Hi there,
try this CSS instead:
@media (min-width: 1025px) {
.main-navigation .menu-bar-items {
order: -1;
z-index: 110;
}
.navigation-search.nav-search-active {
z-index: 100;
padding-left: 70px;
}
}
thanks for the quick response. that did the trick!
just one small issue, David. In the sticky header, the search icon appears all the way to the left before the logo.
Try this as well:
@media (min-width: 1025px) {
.main-navigation.navigation-stick .menu-bar-items {
order: 1;
}
.main-navigation.navigation-stick .main-nav {
order: 5;
}
}