We’ve been having this issue on screens with smaller sizes, or when the browser window is split in half. Our header (logo) moves behind the text (menu options).
I’ve searched and couldn’t find the right answer. Wondering if there is some shortcode that would tell it to not overlap, would much prefer it to just collapse like how it looks on mobile.
Any help would be greatly appreciated!
Hey alexx8675,
In the WP Dashboard, go to Enfold > Main Menu > General (tab) > Menu Items for mobile set this to Activate for Smartphones and Tablets (browser width below 990px).
Hope this helps.
Best regards,
Nikko
I will give this a shot but this issue is actually on desktop or tablets mainly. Basically if you have a 1920×1080 monitor which is standard for most if you are only viewing it using a split screen it tucks the header logo behind the text.
Just checked and this option has already been selected. My issue with the logo image over/underlapping the menu options is on desktop (if screen is split) or tablets.
Hi,
Thanks for the clarification. Please try the following in Quick CSS under Enfold->General Styling:
@media only screen and (max-width: 1450px) {
nav.main_menu {
display: block !important;
}
#avia-menu .menu-item {
display: none;
}
.av-burger-menu-main.menu-item-avia-special {
display: block;
}
}
Best regards,
Rikard
Awesome, it worked!
Thank you so much.
Hi,
I’m glad this was resolved. If you need additional help, please let us know here in the forums.
Best regards,
Jordan Shannon