Solved

dawn theme product grid is all different sizes and i can't figure it out.

safewatch360
Visitor
2 0 0

dawn theme product grid is all different sizes and i can't figure it out.

https://sr1098nzq9otmcut-73389769013.shopifypreview.com

 

i haven't adjusted any of the css except for section-main-product.css adjusting max width to 50% on .product--large under @media screen and (min-width: 990px) but this isn't used on the product collections.  I also removed "zoom" via custom css but that is the same file as mentioned earlier. 

 

it's basically the default dawn theme.  95% of all the pics are the same dims.  except for the really big one displayed and it's actually smaller in dims.  yet it's the biggest.  

 

check any collection on the site.  check under products menu or scroll to bottom of home page.  the grid is all whack.  how can i make it consistent.  not too big, not too small.  i'm googled out on this topic.  HELP!!!

allovertheplace.png

bpar
Accepted Solution (1)

SAN_MSWEB
Shopify Expert
889 110 116

This is an accepted solution.

Hi @safewatch360 


I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the base.css file:
.card__inner {height: 275px;}

.card__media .media img {object-fit: contain !important;}

 



Regards,

San

If it’s helpful to you, please mark it as a solution.  


Need Help with Shopify Design, Migration, Speed, or Custom tasks?  
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin

View solution in original post

Replies 4 (4)

SAN_MSWEB
Shopify Expert
889 110 116

This is an accepted solution.

Hi @safewatch360 


I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the base.css file:
.card__inner {height: 275px;}

.card__media .media img {object-fit: contain !important;}

 



Regards,

San

If it’s helpful to you, please mark it as a solution.  


Need Help with Shopify Design, Migration, Speed, or Custom tasks?  
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin

safewatch360
Visitor
2 0 0

Worked like a charm!  thank you so much.  that was driving me insane.  

bpar
emmlpop
Visitor
1 0 0

Hi,

 

I also just tried this with my Dawn theme and it worked great to make the pics the same size (thank you!), but it has added some grey space around some pics. Is there a way to resolve that? I'm using two different print-on-demand apps, and their images are different sizes.

 

.Screenshot 2023-06-07 at 20.17.22.png

ErkenciKus
Visitor
1 0 0

did you resolve this?