Off Canvas Menu On Tablet Held Horizontally
Arne Opheim
Hi, I have a website that uses both mega menu and off canvas menu. But the megamenu is so wide that only parts of it show on the tablet, when held horizontally. When the tablet is held in a vertical position, this is not a problem. Then only the burger menu is displayed.
Is there a way to make only the burger menu appear on the tablet, even when the tablet is held in a horizontal position?
I do not want both the mega menu and the burger menu to appear at the same time, whether it is laptop, tablet or mobile.
Regards Arne Opheim
Ofi Khan
Accepted AnswerPlease use this CSS to Template Options -> Custom Code -> Custom CSS
@media (max-width: 1200px) {
#offcanvas-toggler {display: flex !important;}
#sp-menu .sp-megamenu-parent {display: none !important;}
}Ofi Khan
Accepted AnswerYou are welcome 😊
I have a humble request. It would be very kind of you if you can manage some moment to give us feedback on
This will inspire us to improve.
Ofi Khan
Accepted AnswerHello Arne Opheim
Please use this CSS to Template Options -> Custom Code -> Custom CSS
@media (max-width: 1200px) {
#offcanvas-toggler {display: block !important;}
#sp-menu .sp-megamenu-parent {display: none !important;}
}Best regards
Arne Opheim
Accepted AnswerHi, and thank you for the quick answer and the solution to my problem. But is it possible to move the burger icon a little down, so it will be centered and more alligned to the search box?
The icons in the Mega menu have now somehow been changed to some strange characters. Do you know how I can fix it again and get the correct icons back?
Please find scrennshots here: https://arbeid5.joomla4.no/menu-issues3
Regards Arne
Arne Opheim
Accepted AnswerHi Ofi, Thank you very much, Ofi. Now it looks very good.
Regards Arne Opheim
Ofi Khan
Accepted AnswerYou are welcome.
I have a humble request. It would be very kind of you if you can manage some moment to give us feedback on Joomla Extension Directory. This will inspire us to improve.