How can I remove this white line from mobile header? I already removed it from desktop

Store Design
1

Screen Shot 2025-03-11 at 3.11.55 PM.png
Screen Shot 2025-03-11 at 3.11.55 PM.png447×114 49.1 KB

I have removed it from desktop, but for some reason it is still showing up on mobile

I also tried to add the code

/* Delete the divider line under the header section */ .site-header__divider { display: none; }

but that didnt work as well.

1 Like
2

Hey @mayatranquila

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-1741721166612.png
Moeed_0-1741721166612.png378×122 66.6 KB

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

Best Regards,
Moeed

3

Find this line in your /assets/section-header.css file “html.js .header.is-transparent:not(.menu-open):not(.is-scrolled) .header__inner:after”

And remove the background color or add transparent instead of currentcolor. It will be fixed.

If you give me collab access, I will do that for you.

Thanks

4

Hi @mayatranquila

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

.header__inner:after {
    background: transparent !important;
}

Best,

Daisy