Hey,
You should first remove this css:
ul#menu-cb-menu {
width: 840px;
}
that will cause issues with the responsive css.
Then you can add this css:
@media (max-width: 1200px) {
header #nav-main {
margin: 0;
}
#nav-main ul.sf-menu {
display: none;
}
#mobile-nav-trigger {
display: block;
}
}
Hope that helps,
Kadence Themes
Now my menu isn’t all on one line (which was the purpose of that little bit of CSS I just took out)
Any solution that allows me to have both?
Yeah, it’s just an issue of not defining a width. so css like this:
@media (min-width: 1200px) {
.kad-header-right {
width: 75%;
}
.kad-header-left {
width: 25%;
}
}
Kadence Themes
This now assigns the mobile menu at all widths.
Sorry to be a pain.
In fact, it assigns the mobile at all widths apart from the landscape tablet size
Hey,
maybe I miss understood.
The menu breaks down by default at the screen width of 992 pixels. The css I sent should have made it so the menu switched at 1200px.
Which depending on your device should mean most tablets even in landscape mode would show a mobile menu. Is this not what you wanted?
Kadence Themes
ok, I just clicked on to your site. I see your css isn’t right. Your not closing out of the media queries.
see how in the post I sent there are two closing brackets after the media size css is finished.
Your missing the second.
Kadence Themes
Oh, thats my fault.
Now it works. Thanks for your patience!
Have a nice day
