Hi

Thanks for contacting us. Could you please give me a screenshot of that portion?

-Regards.

Sure, here is the megamenu correctly working.

Here the offcanvas toggler (red arrow) that I'd like on the left (green arrow).

Thank you

You can use this custom CSS

@media (max-width: 767px){
.burger-icon {
    position: relative;
    right: 160px;
}
}
@media only screen and (max-width: 1180px) and (min-width: 768px)  {
.burger-icon {
    position: relative;
    right: 460px !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.

The burger menu is fine now, but the X in offcanvas isn't showing up correctly (it worked fine before adding the custom css you suggested).

Can you please fix this issue as well?

Thank you Andrea

Hi

Sorry for this inconvenience. Could you please give me your super admin access on the hidden content so that I can check?

Hi

Sorry for this inconvenience. Could you please give me your super admin access on the hidden content so that I can check?

Yep

Hi

Use this custom CSS

@media (max-width: 850px){
body.ltr #offcanvas-toggler.offcanvas-toggler-left{
    margin-right:120px !important;
}
}

Hi, I tried but didn't work. I chose for not showing the X using this custom code:

.offcanvas-active .burger-icon > span,
#modal-menu-toggler.active .burger-icon > span 
{ display: none !important;}

By the way, on mobile the toggle bar is fine, on tablet right: 460px is too much,

@media only screen and (max-width: 1180px) and (min-width: 768px)  {
.burger-icon {
    position: relative;
    right: 480px !important;
}
}

is a little bit better on many devices. There is a way to make it aligned on the left instead of setting a relative position?

I think its also ok if you put it like this

https://prnt.sc/GINLfPb3Kzlg

And if you want to reduce then just reduce the number right: 480