Mobile Menu Placement

[jonathanrockett]

Hi Guys,

Here’s what might be a silly question:

I’m trying to move the mobile menu toggle on this site to the right a bit, because it is cramping the other elements to its Left in the header bar: https://skytechdev.sizzlingdigital.com

I have the Outer Spacing for the Nav Bar set to 2 EM (which looks good on the Left side), but there seems to be extra margin or padding on the right side…

I’ve looked at the settings for the CTA & Mobile Navigation container, as well as the settings for the Navigation Collapsed element itself (all margins and padding set to zero). I even tried to set the margin to a negative amount to get it to move to the right, with no luck…

Any ideas?

Thanks!

[tristup]

Hi @jonathanrockett,

Thanks for reaching out.

It seems the Burger menu width is set to with 7em and that is the cause of the gap from the right. I would suggest you remove the width and add a margin to left as per your need.

Or you can try by adding a piece of custom CSS to Theme Options > CSS

.e4573-10.x-anchor-toggle 
{
    width: auto !important;
    margin-left: 30px !important;
}

The above code will work if copied as it is and doesn’t conflict with any existing code.
Please note that the code provided serves only as a guide to help you get started custom coding on your own if there’s no option offered in our theme or the products we bundle.
We do not provide support for custom codes that means we can’t fix it in case it conflicts with something in your site nor will we enhance it.

Thanks

[jonathanrockett]

Makes total sense (it’s usually something simple). I simply changed the size of the burger to 4em - problem solved.

Thanks so much.

[marc_a]

Hi @jonathanrockett,

You’re welcome and it’s our pleasure to help you. If you have any other concerns, feel free to reach us.

Thank you.