How to make an image fill div instead of having border in Brooklyn Theme

stephirig
Tourist
3 0 2

Hi all! I want to get rid of the light pink borders around my product images in all collections and instead have it just fill the area with the whole image and cropped to the aspect ratio. I'm not bad at code but I've been digging through it and I cannot figure out where to fix this. I'm using Brooklyn Theme, and my store is here: https://makeamess.myshopify.com/

Any help would be greatly appreciated, thank you!!

dmwwebartisan
Shopify Partner
5244 1211 1551

@stephirig 

Please add the following code to remove pink border from the collection images. Add this code at the bottom of your assets/theme.scss.liquid file.

.grid-product__image-link{
background-color: transparent !important;
}

 

Hope this helps.

Thanks! 

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
stephirig
Tourist
3 0 2

This removes the background but I really just want the image to fill the space. I think cover not contain is the term in some places?

dmwwebartisan
Shopify Partner
5244 1211 1551

@stephirig 

We can't fill up the images like rectangular shape because images can be vertical or can be horizontal therefore they have given background behind it or a wrapper which feels that images are looking good.

This is my thought but you can give your opinion.

 

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
stephirig
Tourist
3 0 2

I think I'm looking for a solution like the one described here: https://stackoverflow.com/questions/14142378/how-can-i-fill-a-div-with-an-image-while-keeping-it-pro...

Not sure if it's possible without a big code rewrite but that'd definitely be easier for uploading all sizes of images in the future, for me at least.

Thank you for your help though!

0 Likes