Mobile breakpoint and menu button

Hi X,

I always use following css to change the navbar breakpoint for the menu (in X):

/* mobile menu breakpoint*/
@media (max-width: 1200px){
.x-nav-wrap.desktop {
display: none;
}
.x-btn-navbar {
display: block;
float: right;
}
.x-nav-wrap.mobile.collapse.in {
display: block;
}
}

On this site (https://www.dcw.nl/) this code prevented the mobile button to collapse (after updating x i guess, it always worked fine). So i had te remove this. Is there any new updated code to achieve this? The nav items are now falling below the line at certain screen size point…

Thanks in advance!

Hi @timschouwink,

Thanks for writing in.

There are no new codes or new class updates on our latest updates.

Please update your code to this.

@media (max-width: 1200px){
.x-nav-wrap.desktop {
display: none;
}
.masthead-inline .x-btn-navbar {
display: block;
float: right;
}
.x-nav-wrap.mobile.collapse.in {
display: block;
}
}

Check your CSS above this code if you miss open or close braces because it will not be executed if you miss one brace.

Let us know how it goes.

Thanks. :slight_smile: