[Resolved] Add padding under header

[Math]

Hi,

When I go to the customization option (Layout > Header > click on mobile) and add padding to bottom of the header, nothing happens. Is this something I have add manually in CSS?

Also, in mobile view the logo is much larger than the original size chosen. Why does it jump sizes?

https://marzproject.com/

Thank you.

[Leo]

Hi there,

You are using the mobile header option so the default header padding doesn’t apply.

Can you try adjusting the menu item height with mobile toggle activated to see if you can make it work?
https://docs.generatepress.com/article/menu-item-height-width/

[Math]

When I toggle to the mobile header there isn’t any padding applied, so I entered 40px to the bottom, but I don’t see any changes.

Also, how do I adjust the logo size in mobile screen? It’s jumping up in size.

[David]

Hi there,

if you want the logo to be the exact same size on Mobile then add this CSS:

.main-navigation.mobile-header-navigation .site-logo.mobile-header-logo img {
    height: auto;
    max-width: 120px;
}

If you want to add some space below the mobile header – add this:

.main-navigation.mobile-header-navigation {
    margin-bottom: 40px !important;
}

[Math]

Thank you.

[David]

You’re welcome

[Author]

Posts