Hi,
From iPad tablet, main menu is not displayed correctly.
how is the good process to change correctly menu break point for screen sizes on helix ?
see here : https://prnt.sc/Xq59dchORSuf
live here : https://www.momentum-patrimoine.com/
Thanks
L.
for those who need the solution, a sample below :
@media (max-width: 1199px){
nav.sp-megamenu-wrapper .sp-megamenu-parent {
display: none !important;
}
#sp-header nav.sp-megamenu-wrapper #offcanvas-toggler {
display: block !important;
}
.burger-icon {
margin-top: 23px;
}
}Hi
Thanks for contacting us . You can use this custom CSS
.sp-megamenu-parent>li>a, .sp-megamenu-parent>li>span, .sp-megamenu-parent .sp-dropdown li.sp-menu-item>a{
font-size:11px !important;
}
Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.
-Regards.
thanks for your feedback.
but I don't want to reduce font size, but menu break point for tablet.
You need to know the CSS for that. I think this link may help you.
https://stackoverflow.com/questions/6370690/media-queries-how-to-target-desktop-tablet-and-mobile
yes i know that.
but for HELIX, what are the right css classes I need to override to change menu breakpoint?
what is your advice?
This is the menu Css class
.sp-megamenu-parent>li>a, .sp-megamenu-parent>li>span, .sp-megamenu-parent .sp-dropdown li.sp-menu-item>aYou can inspect it and find it from here
