[youngstudiosParticipant]

I have tried several css from the forum and none of them will remove the white border around my images on single product page example: http://ayoungstudios.involve.media/product/product-1/

Thanks,

[DarshanaModerator]

Hi there,

Thanks for writing in! Could you please try adding the following CSS workaround into your Customizer, Custom > CSS area.

.x-img-thumbnail {
    background-color: rgba(0, 0, 0, 0);
}

Hope that helps.

[youngstudiosParticipant]

That worked perfect. I would also like to remove the same from related products at the bottom of the page.

[FriechModerator]

Hi There,

You can add this under Custom > CSS in the Customizer.

.woocommerce .related ul.products li.product {border-width: 0;}
.related .entry-featured a {background-color: transparent;}

Hope it helps, Cheers!

[youngstudiosParticipant]

Thanks, however there still seems to be a one pixel white/grey line on the bottom of the image

[RadModerator]

Hi there,

The line is part of the image.

Please check this, https://jsfiddle.net/vrmouevw/

Thanks.

[youngstudiosParticipant]

I actually replaced all the images to be sure the line is not in the image, you can see there is still a one pixel bottom border.

http://ayoungstudios.involve.media/product/guiding-home/

[RupokMember]

Hi there,

Thanks for updating. Let’s add this :

.woocommerce .related ul.products li.product {
  background: transparent
}

Hope this helps.

Cheers!

[Author]

Posts