dekstop vs mobile Header sizing

Shopify Discussion
1

Hi Shopify community,

I’m struggling with my Header, where my mobile look well, my desktop is not.

how to change the size of my desktop header like the mobile one, without impacting the mobile sizing.

website : https://www.bonnedose.co/

Best

2

Hey @Vironne

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1733838578149.png
Moeed_0-1733838578149.png1896×914 227 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

3

Hi @Vironne

To complete your requests, please follow these steps:

  1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
  2. Paste the code provided into the Custom CSS section.
@media screen and (min-width: 1024px){
header.header {
    padding-block: 10px !important;
}
}

Here is the result: https://prnt.sc/uGgyGlLwn7IX

I hope this helps

Best,

Daisy

4

thanks a lot :slightly_smiling_face: