Why do my product images change size on refresh?

[LanaDaya]

Hi,

I want to ask if anyone know what happen. I use metafields to list a product. The sizes of the image are all the same yet the grid changes everytime I refresh. The grid that I used comes from other pages and it seems nothing is wrong only to this particular page which I assume from the metafields. 

Please let me know how to solve this. 

 

[gr_trading · Accepted solution]

Plz share your store URL 

[LanaDaya]

https://lanadaya.com/products/kedawung-pillow?_pos=1&_sid=d1ddb9c98&_ss=r&variant=42003598999708

[gr_trading]

Try with below CSS.

.pairing-products .product_thumbnail {overflow: hidden !important; display: block; padding-bottom:0 !important;}
.pairing-products .product_thumbnail img {max-height: 100%;}

@media(min-width:768px){
	.pairing-products .product_thumbnail {height: 160px; width: 118px !important;}
}
@media(max-width:768px){
	.pairing-products .product_thumbnail {height: 116px; width: 85px !important;}
}

[LanaDaya]

I have figured it out, sorry for the bother. thankyou!