How can I reduce the header size on Dawn Theme for mobile?

[TriFitHealth]

I already have the padding set to 0 but there is still too much extra space on mobile. I've tried editing code but I can't get it to work. All I need is roughly 5-10 px off the top and bottom of the header. Any help is appreciated!

[PageFly-Henry · Accepted solution]

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

@media (max-width: 767px){

.header__heading-logo {

    max-width: 70% !important;

}

a.header__heading-link.link.link--text.focus-inset {

    padding-top: 0 !important;

    padding-bottom: 0 !important;

}}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[PageFly-Henry]

Hi @TriFitHealth 

Could you share with me the URL page and password, I will help you check it.

[TriFitHealth]

The URL is https://trifithealth.com

[PageFly-Henry · Accepted solution]

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

@media (max-width: 767px){

.header__heading-logo {

    max-width: 70% !important;

}

a.header__heading-link.link.link--text.focus-inset {

    padding-top: 0 !important;

    padding-bottom: 0 !important;

}}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[Dan-From-Ryviu · Accepted solution]

Hi @TriFitHealth 

It cause by blank space around your logo image. You need to remove those space from your logo to change your header size