Archived topic

Mobile Header layout/spacing

3 replies · Started by jonathan on January 14, 2020

Viewing posts 1–4 of 4

January 14, 2020 at 8:04 am #1131892

Hi guys,

I was wondering if you knew a better way to layout a mobile menu that's using a header element?

The MENU sits very low, clashing with the Page Title, and it floats awkwardly to the left. On some mobile devices, the logo buts up against the left and right sides of the screen.

If you had any suggestions on how to tighten this up, Id' really appreciate it!

thanks, as always,

Jon

January 14, 2020 at 10:17 am #1132105

Hi there,

What if you decrease the menu item height with mobile toggle on?
https://docs.generatepress.com/article/menu-item-height-width/

Looks like it's currently at 100px which is quite large.

Try something around 50-60px.

Let me know :)

January 14, 2020 at 1:47 pm #1132243

Thanks Leo,

I realized that I made the menu height 100px so it would align with the logo. Is there any other way to make those two elements vertically align without using the NAV line height?

Jon

January 14, 2020 at 5:00 pm #1132361

Not quite sure if I understand.

When you decrease the menu item height on mobile, the logo and toggle should be aligned by default.

Can you show me if it's not?

Let me know :)

This archived topic is closed to new replies.

Start building better websites today.