[Support request] Mobile Slideout Menu Styling

[Kyle]

Hi guys, Trying to fix some strange styling on my mobile slideout navigation menu. Maybe you can help?

1) When loading the site on most mobile phones, the logo and hamburger menu are stacked, not side-by-side. Any ideas?

2) How can I add padding to the slidout menu top? The top item sits right up at the top of the screen, currently.

3) My arrows are placed oddly. Is there a way to widen that slideout window to fit things in better? (I tried a few solutions on the forum and no luck).

Many, many thanks!

[Leo]

Hi there,

Can you disable Autopimize first so I can see the source of the code better?

Let me know 🙂

[Kyle]

My apologies, I missed this reply somehow. It is disabled now. Thanks for any insights you can offer. I appreciate it!

*Update: moving the close “x” inside of the menu added better top spacing, and maybe took care of #2 as well? The hamburger is now sitting side-by-side with the logo, which is what I was hoping for. Would still love some advice to widen the box in order to get the drop-down arrow on the same line as a couple of the menu items.

Thanks!

[Tom]

Hi there,

Give this a shot:

slideout-navigation .inside-navigation {
    padding-left: 20px;
    padding-right: 20px;
}

Let me know 🙂

[Author]

Posts