Hello,
I have a background color problem where the search icon appears in navigation on mobile devices. Some other CSS tweak I must have made has caused what should be a white background to render as transparent (I think). I haven’t been able to reverse engineer where this is happening and am hoping you may be able to offer a quick fix.
Here’s an example:
Thanks in advance!
Mike
Hey Mike,
Could you post a link to where we can see the element in question please?
Best regards,
Rikard
Hi Rikard,
If you view any page of our website on a mobile device, or a narrow browser window – click the hamburger menu for navigation and as it pops down you should notice the search icon immediately.
iptor.com
Hi,
Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:
@media screen and (max-width: 767px) {
#top #menu-item-search {
background-color: transparent;
}
}
Best regards,
Rikard
Hi Rikard, that didn’t seem to work.
Hi,
Did you add the code to the very top of quick css so it runs first? Also, be sure to clear the cache a few time over.
Best regards,
Jordan Shannon
Hi Jordan,
I’ve moved the code to the top of the quick CSS box, cleared the browser cache and flushed DNS a few times but the problem is still lingering.
Hi Mike K,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
.av-burger-overlay-active #top #wrap_all #header #menu-item-search a {
background-color: #fff;
}
If you need further assistance please let us know.
Best regards,
Victoria