White space under header - desktop only

Hi there,

Is someone able to help me remove the random white space under the desktop header? Mobile version seems to be fine. Please see photo.

URL: https://admin.shopify.com/store/wss10u-is/themes/175807824166/editor?section=sections–24209590354214__header&context=theme&customCss=true&previewMode=fullscreen

Thank you.

Hi @ellacoker

I hope you are well. You can follow our instructions below:

1/ Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
2/ From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
3/ Copy the code below and paste it there

Here is the code for Step 3:

@media screen and (min-width: 769px){
.cart-notification-wrapper.page-width {
    padding: 0 !important;
}
}

Please let me know if it works. Thank you!

Best,
Daisy - Avada Support Team.

Thank you Daisy! It worked! However, not my announcement bar is really thick. How do I make it skinnier again?

Hi Ellacoker

  • You can try to follow this step
    Step 1: Go to Edit code
    Step 2: Find file base.css and add this code at the end of the file
.announcement-bar__message {
   padding-top: 0.5rem !important; 
}

div#shopify-section-sections--24209590354214__announcement-bar {
    height: 28px !important;
}

Result:

Best,
LizHoang