How can I eliminate the border around product images?

Store Design
, , , ,
1

Hello,

There seems to be this border around my product images on the collection as well as product pages.

Here is the border I am refering to:

product border.JPG
product border.JPG697×723 24.9 KB

Anyway we can remove this border?

Store URL: https://merciane.com/

Thank you!

2

Hello @MotionStore111

You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.

img.product-item-img.img-fluid.mb-4.rounded {
    border: 1px solid var(--bs-border-color);
    padding: 0.25rem;
}
1 Like
3

@oscprofessional
Doesn’t seem to apply any change.

4

Hello @MotionStore111

You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.

img.product-item-img.img-fluid.mb-4.rounded {
    border: none!important;
    
}
1 Like
5

Hello @MotionStore111

You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.

.img-thumbnail {
    border: none !important;
}
6

Hey @MotionStore111

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

Moeed_0-1689250239563.png
Moeed_0-1689250239563.png1902×860 112 KB

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

Best Regards,
Moeed

1 Like
7

Thank You Moeed that does it.