Dawn Theme Collection Images Cut Off Using Square Image Ratio

kescrane
Not applicable
3 0 0

Hi! I'm uploading images straight from my vendors product sheet. 

 

When using the square image ratio on a collection page - some of the items are getting cut off.

When using the "adapt to image" image ratio on a collection page, those that are getting cut off previously are too big and causing misalignment. 

 

Is there a way to fix this code-wise so that the square image ratio is used, and the image height is adjusted so that it fits within the square container OR use adapt to image, but have a max height? 

 

I've seen a few questions out there, but none of the code has worked when I've put it in. Would also rather go the code route than an image resizer if it's possible. Newbie coder, so please tell me what CSS section I need to put the code in or I'll be clueless!  Thank you!

 

Square Image Ratio:
Square Image Ratio.png

 

Adapt to Image:

Adapt to Image.png

 

 

Replies 3 (3)

Liqiud_xPert_SJ
Shopify Partner
814 101 129

@kescrane 

 

can you please share a store url where you are facing this issue so that i can give you an exact solution.

 

thanks

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
kescrane
Not applicable
3 0 0

We are still in draft mode, so I don't have anything to show right now except the screen shots.

Liqiud_xPert_SJ
Shopify Partner
814 101 129

there will be a theme preview option or if you are in draft mode you can share the url with store front password so that i can only see it

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂