New Shopify Certification now available: Liquid Storefronts for Theme Developers

Change header size (Dawn Theme)

Solved
TriFitHealth
New Member
7 0 0

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!

Accepted Solutions (2)
PageFly-Henry
Globetrotter
519 132 107

This is an 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

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

Dan-From-Ryviu
Shopify Partner
5679 1047 1073

This is an 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 Screenshot 2023-09-22 at 09.09.51.png

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now

View solution in original post

Replies 4 (4)
PageFly-Henry
Globetrotter
519 132 107

Hi @TriFitHealth 

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

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

TriFitHealth
New Member
7 0 0
PageFly-Henry
Globetrotter
519 132 107

This is an 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

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

Dan-From-Ryviu
Shopify Partner
5679 1047 1073

This is an 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 Screenshot 2023-09-22 at 09.09.51.png

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now