Tagged: Break Point, breakpoint, full width sub menu
Hi,
How can I change the breakpoint for a Full Width Sub Menu using a custom CSS class, in this case the class is
products-menu
I need to set the burger menu to appear at 1300 px or less.
Thanks
Phil
Hi Phil,
Could you post a link to where we can see the element in question please?
Best regards,
Rikard
Hi Rikard,
We managed to fix it like this
`@media only screen and (max-width: 1300px) {
.responsive #top .av-menu-mobile-active {
text-align:center
}
.responsive #top .av-menu-mobile-active .mobile_menu_toggle{
display:inline-block
}
.responsive #top .av-menu-mobile-active .av-subnav-menu{
display:none
}
.responsive #top .av-menu-mobile-active .av-subnav-menu.av-open-submenu{
display:block
}
.responsive #top .av-menu-mobile-active .av-subnav-menu > li {
display: block;
border-top-style: solid;
border-top-width: 1px;
padding: 0;
}
.responsive #top .av-menu-mobile-active .av-subnav-menu > li:first-child {
margin-top: -1px;
}
.responsive #top .av-menu-mobile-active .av-subnav-menu > li > a {
border-left: none;
padding: 15px 15%;
text-align: left;
}
.responsive #top .av-menu-mobile-active .av-subnav-menu > li a::before {
content: “\25BA”;
position: absolute;
top: 15px;
margin-left: -10px;
font-family: ‘entypo-fontello’;
font-size: 7px;
}
.responsive #top .av-open-submenu.av-subnav-menu > li > a:hover,
.responsive #top .av-subnav-menu .current-menu-item a:hover .avia-menu-text {
color: #53565a;
}
}
Regards
Hi,
I’m glad this was resolved. If you need additional help, please let us know here in the forums.
Best regards,
Jordan Shannon