Offcanvas: Position beneath Menu - Forum | JoomShaper
Solved Helix Framework

Offcanvas: Position beneath Menu

Asked by jpberry 5 years ago Last activity 5 years ago

In order to have a fluid with menu on https://clef-des-champs.ch/ I had to create a custom header instead of the predefined header.
But since then the offcanvas menu on https://clef-des-champs.ch/ appears beneath the Menu.
If I set margin-top to -105px in body.ltr #offcanvas-toggler.offcanvas-toggler-right the offcanvas menu doesn't work anymore.
Any ideas how I can solve this problem?
Thanks and Happy New Year

Accepted answer

Marked as the solution
Pavel
5 years ago

Hi.
You should adjust the column width in the template settings for different devices. (Column Grid settings)

9 more replies

Oldest first Newest first Most helpful
jpberry Asked this
5 years ago

Thanks, that did the job!

jpberry Asked this
5 years ago

Thanks, that did the job.

Rashida Rahman Staff
5 years ago

Thanks Pavel, for your valuable contribution to the forum!

Pavel
5 years ago

You are wellcome :)

jpberry Asked this
5 years ago

Sorry to bother you again.
I just realised that the menu on https://clef-des-champs.ch/ doesn't change in to offcanvas mode in tablet view ... Do I have to change the breakpoint or can I adapt the settings in the layout builder of my helix ultimate template?

Pavel
5 years ago

Hi. In bootstrap, Tablet breakpoint starts at 991 px. Everything is working correctly on your site. If you need to do it on a wider screen size, you need to write custom css code for this

jpberry Asked this
5 years ago

Yes, but I want to set the breakpoint for canvas menu at 1024px already. How can I do that?

Pavel
5 years ago 
@media (max-width: 1023px) {
    .sp-megamenu-parent {
        display: none !important;
    }
    #offcanvas-toggler {
        display: block !important;
    }
}
jpberry Asked this
5 years ago

Great, thanx!

Log in to reply.