Mobile menu left-alignment padding

[Georges]

Hello Lay Theme crew,

I’m customising my mobile menu to align left, as seen here http://laythemeforum.com:4567/topic/634/mobile-view-menu-align-to-the-left/3, but the padding isn’t having any effect. The menu is too close to the left edge of the screen, and should instead left-align with the main site title (also left-aligned) and the overall site content. I would expect a left-aligned mobile menu to take on the same left/right space percentage (5% in my case) as the default set in Customizing ▸ Mobile (Smartphone) ▸ Mobile Spaces. I've tried changing it to 5%, 10% padding, still no change.

Many thanks for your help.

[mariusjopen]

Hi Georges!

Can you post a link to your website?

Then I can have a look.

Best!

Marius

[Georges]

Thanks Marius. It's type.practise.studio.

[mariusjopen]

Hi Georges!

Try to add this to your Custom CSS for Mobile Section:

.use-mobile-menu nav.primary li a {
    padding-left: 5vw;
}

VW is related to the window width.

I hope that helps!

Best!

Marius

[Georges]

Hi Marius, thanks for your suggestion. I've tried it, and it doesn't appear to make any difference. The mobile menu nav list is still where it has always been positioned, too far to the left, misaligned with the rest of the site's content. I tried 10vw, 15vw, just to see if it's doing anything. No change.

This is what I'm now running:

.use-mobile-menu nav.primary li a {
text-align: left;
padding-left: 5vw;
}

[mariusjopen]

Hi Georges,

try this one:

body.use-mobile-menu nav.primary li a {
    padding-left: 5vw !important;
}

Let me know if that works!

Best!

Marius

[Georges]

I realise that I never ended up confirming that your last suggestion worked! Many belated thanks!

[mariusjopen]

Very happy to hear :-)