Hi there!

Thanks for your query.

Please use the following code in your custom CSS:

@media (max-width: 575px){
div#sp-logo {
    width: 80%;
}
#offcanvas-toggler {
    margin-top: -70px;
}
}

Note: 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.

Best Regards

Thank you, but on iPad I am seeing same issue. See screenshot link - https://prnt.sc/23ukrb7

Please help.

Any response to it being out of menu area on ipad?

See screenshot link - https://prnt.sc/26brzwg

On iPad Pro there is also an issue. See screenshot link - https://prnt.sc/26bs097

Hi there!

Sorry for the delayed response.

Please use the following code in your custom CSS instead of the previous code that I have provided before:

#sp-header .row {
    display: flex;
}

Kindly, do let me know if it soves your issue or not.

Best Regards

Thank you. Works, BUT the icon has shifted to the left, beside the logo. How can I get it to justify to the right?

Have you removed my previous code already, and cleared cache? Kindly do let me know.

Yes, I removed previous css code & cleared cache.

Thanks for the confirmation.

It is not getting enough space. Please use the following custom CSS:

@media (max-width: 991px){
#sp-logo, #sp-menu{
    width: 50%;
}
}

Hope this time it will be okay...

Best Regards