Solved

How to remove the thin border around the product images (in the actual product pages)

irrimiri
Excursionist
15 0 7

Hello,

I've stumbled upon a similar topic (from a year ago) with the same question, however, the solution that was offered didn't work for me. 

The topic offered the following code below, and had to be placed at the bottom of the assets/base.css. But it sadly made no change to my website.

 

.card--outline:not(.card--soft) { border: 0rem solid transparent !important; } .product__media-list .product__modal-opener { border: 0rem solid transparent !important; }

 



I'm using the Dawn theme and wonder, is there perhaps a different snippet of .CSS code that I could use to remove the thin border around the images in the product pages?


Below shows an image of the thin borderline I mentioned.

Thanks so much in advance for your time in advance,

 

 

Screen Shot 2022-04-14 at 05.54.45.png

Accepted Solution (1)

Halothemes
Trailblazer
168 30 44

This is an accepted solution.

Hi @irrimiri , 

 

You can try follow the instruction below:
1. Go to Online Store -> Theme -> Edit code.
2. Asset -> /base.css paste code below into end of the file.

.global-media-settings {
    border: none !important;
}

 

If code doesn't work. Please share your store URL and password of front view.

So that I will check and let you know the exact solution here.

 

Best regards. 

HaloThemes - Top Premium Shopify Theme Provider
Ella Shopify Theme OS 2.0 - #1 Best Selling Shopify Theme of All Time
Want to try Shopify? Open a Store for FREE

View solution in original post

Replies 12 (12)

oscprofessional
Shopify Partner
15830 2369 3072

Hello @irrimiri 

Welcome to the Shopify Community! Please share your store URL, so that I can check you issue and will back to you with proper solution. Have a Good Day!....

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
Kinjaldavra
Shopify Partner
2302 570 1422

 

Please share your store URL, so that I can check your issue and will back to you  solution

irrimiri
Excursionist
15 0 7

Thanks  so much for the offer to help. But it's solved 🙂
I just tried Halothemes' code snippet, and it worked like a charm. 

irrimiri
Excursionist
15 0 7

Thanks  so much for the offer to help. But it's solved 🙂
I just tried Halothemes' code snippet, and it worked like a charm. 

Halothemes
Trailblazer
168 30 44

This is an accepted solution.

Hi @irrimiri , 

 

You can try follow the instruction below:
1. Go to Online Store -> Theme -> Edit code.
2. Asset -> /base.css paste code below into end of the file.

.global-media-settings {
    border: none !important;
}

 

If code doesn't work. Please share your store URL and password of front view.

So that I will check and let you know the exact solution here.

 

Best regards. 

HaloThemes - Top Premium Shopify Theme Provider
Ella Shopify Theme OS 2.0 - #1 Best Selling Shopify Theme of All Time
Want to try Shopify? Open a Store for FREE

irrimiri
Excursionist
15 0 7

This worked! Thank you so much! 

Califournicatio
New Member
4 0 0

it didnt work for me 😞

oscprofessional
Shopify Partner
15830 2369 3072

 

@Califournicatio ,

Can you share your issue with URL.

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
Thalie
Tourist
4 0 1

Hi, it doesn't work for me. I still have the lines around images in my blog articles. 

 

Can you help? 

 

Thanks!

 

Thalia

oscprofessional
Shopify Partner
15830 2369 3072

@Thalie ,

Please share the issue with URL and password with screenshot.

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
tntgamer187
Visitor
1 0 0

I'm having the same issue I already tried to customize the code as indicated on this post and it did not fix the problem, I am using Dawn as my theme.

Ulrika
Visitor
2 0 0

This piece of code doesn't work for me, and I don't really know anything about editing code. Do you have some more detailed information of exactly how to add this code? Thanks!