Line under banner

[1karod1999]

 Hi! 

Is there a way to remove the white line under the banner? The line only appears on the phone.

store URL: https://407acc-b9.myshopify.com/

password: adreul

 

[BSSCommerce-HDL · Accepted solution]

Hi @1karod1999 , 
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

Step 3: Insert the below code at the bottom of the file -> Save

@media only screen and (max-width: 767px) {
   .color-scheme-3.isolate.gradient:has(.collection) {
    transform: translateY(1px); 
   }
}

Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[dws_pvt_ltd · Accepted solution]

Wrong CSS. Please check it. @1karod1999  New add CSS.

@media only screen and (max-width: 767px) {
   .color-scheme-3.isolate.gradient:has(.collection) {
    transform: translateY(-1px); 
   }
}

[BSSCommerce-HDL · Accepted solution]

Hi @1karod1999 , 
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

Step 3: Insert the below code at the bottom of the file -> Save

@media only screen and (max-width: 767px) {
   .color-scheme-3.isolate.gradient:has(.collection) {
    transform: translateY(1px); 
   }
}

Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[dws_pvt_ltd · Accepted solution]

Wrong CSS. Please check it. @1karod1999  New add CSS.

@media only screen and (max-width: 767px) {
   .color-scheme-3.isolate.gradient:has(.collection) {
    transform: translateY(-1px); 
   }
}

[1karod1999]

It's worked. Thank you!

[1karod1999]

Thank you!

[BSSCommerce-HDL]

@1karod1999 

We're happy to see that our suggestion helped you solve the issue.

Should you need any further information, please do not hesitate to contact us by tagging directly at Community post. We will check and let you know soon.

Thanks in advance 😍

[1karod1999]

I would be grateful if you would look at it again. The gaps have now appeared in other places 😞

[BSSCommerce-HDL · Accepted solution]

Hi @1karod1999, Pls insert this code to your file css: 

.banner.banner--content-align-center {
        margin-top: -1px !important;
}

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍