How to reduce the header height using the Dawn Theme

Store Design
1

Hi there,

I am trying to reduce the height of the header on my store as it is too big on mobile. There is too much blank space above and below my logo and hamburger menu.

I have tried a number of different coding options but with the new Dawn theme none are working.

Can someone provide some clarity on this issue?

Thanks,

All Occasions

2

@AllOccasions

Paste this code on top of the base.css file.

@media only screen and (min-width: 992px) {
header.header.header--middle-left.page-width.header--has-menu {
    height: 95px !important;
    margin-top: -15px !important;
}
}
3

Hi AllOccasions,

Can you please share your store URL here?

4

@AllOccasions
Welcome to the Shopify community!
Thanks for your good question.

Please share your store URL.
So that I will check and let you know the exact solution here.

5

Hi there, I tried pasting that starting on the first line of the base.css file but unfortunately it didn’t work.

6

@AllOccasions
Welcome to the Shopify community!
Thanks for your good question.

Please share your store URL.

7

Hi there,

The URL is https://alloccasionscloset.com but the new Dawn theme is not published yet.

Thanks

8

@AllOccasions
Share me preview url

9

Here is the preview URL https://ta8ag7hs68aosw4h-30038628.shopifypreview.com

10

Hi AllOccasions,

Thank you for sharing the preview link.

I suggest you should remove the top/bottom empty space inside the logo image(Crop logo image) then upload a new logo. after that, your height issue will be automatically resolved.

Kind Regards,
Jasmin Maru

If helpful, please Like and Accept the Solution.
Want to know more.Email us: jasmin.maru@mlveda.com