How to stop image from being cut off in collection list?

smef
Tourist
18 0 4

Hey! I want to stop my image from being cut off as you can see here:

smef_0-1637381006174.png

I also would like to remove the very faint outline that surrounds the image. I've done this for my main page in the base.css file, but for some reason it's not working on the list collection page. I am using the Dawn base theme.

 

You can find the issue on https://www.razz.blue/products. It's really bothering me, so if anyone could take the time out of their day to help out, it would be much appreciated!

Replies 6 (6)
JHKCreate
Shopify Partner
2922 504 723

Hi @smef 


Would you mind sharing your store's password so we can see the link you've shared? Alternatively you can share a preview link if you don't want to change the store's password later on.

 

Cheers!

Did we solve your issue? Like & Mark As Solution to help the community | Should you need any direct help: contact@jhkcreate.com
| Learn more about us: jhkcreate.com


| Satisfied with our solutions? Drop a review on Google

smef
Tourist
18 0 4

The password is "boner"

Charline1
Tourist
8 0 0

Hi @smef,

 

Have you solved this issue?

 

I have the same issue like this in Dawn, I want to show the featured brands in the collection list, but most of the brand logo images are just cut off! I have tried to look up solutions but this is the only post I can find. Really hope yours have bee solved. If you have, could you please share what the solution is, many thanks in advance!!!

 

Charline

smef
Tourist
18 0 4

@LitExtension resolved it for me.

smef_0-1638306529994.png

Please thank him.

smef
Tourist
18 0 4

Here is LitExtension's code:

 

.collection-list__item .card{ border: none !important; } .collection-list__item:only-child .media{ height: 0 !important; }

Charline1
Tourist
8 0 0

Thanks @smef 

 

I didn't get much luck on the code, I tried it but didn't actually solve my issue, so I had to do the traditional way, i.e. added a background layer at the back of the image, cropped and resized it in the way the system would accept, took a bit time but at least now the images in the collection list are not cut off.