[Support request] How to change bottom margin of slide-out Navigation on mobile?

[Emil]

Hi!

I use the slide-out menu only on mobile but the button/link on the bottom of the list has no margin and gets hard to click on and even see.

I would like to have more space at the bottom of the slide-out navigation so that you easily can see and click on the buttons/links when you need to scroll the menu. How do I accomplish that?

[Leo]

Hi there,

Since there are a lot of menu items, I believe the best solution for your case would be to reduce the menu item height on mobile:
https://docs.generatepress.com/article/menu-item-height-width/#height

Let me know if this helps 🙂

[Emil]

That doesn’t work if you for example hold the phone horizontally and needs to scroll.

[Emil]

Even if I change the height of each menu item to a smaller size the bottom item is at the bottom of the screen which make the Safari “menu” pop up when I try to click the link.

If the link is to small it’s not that user friendly i guess. I have 11 items in the menu.

[David]

Hi there,

so this CSS:

#generate-slideout-menu {
    padding-top: 20px
}

Is forcing the slideout down and to cut off the bottom menu item when the device is in landscape.

[Author]

Posts