Tagged: mobile menu
The main navigation on our website appears twice on mobile devices and smaller screens. The desktop navigation and the burger menu are overlapping in the header. We would like it to only be the burger menu on mobile, and the desktop on larger screens. Can you please take a look and let us know how to fix it? I have provided the web address and login credentials below.
Hey Andi,
Sorry for the late reply and thanks for the login, I added this css into your Quick CSS to only show the burger up to 1023px and your main menu to start showing at 1024px, which I found to be the size that it shows well at, please clear your browser cache and check.
@media only screen and (max-width: 1023px) {
ul#avia-menu > li.menu-item-top-level {
display: none !important;
}
.av-burger-menu-main.menu-item-avia-special {
display: block;
}
}
Best regards,
Mike
Thank you!
Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.
For your information, you can take a look at Enfold documentation here
For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)
Best regards,
Mike