How to resize the box height of the product and make it smaller?

[Mamdouh_USD]

Hello all,

I want to make the box height of the product smaller.

Store URL: https://u7yeji-na.myshopify.com/ar/products/nova-water-40-plastic-bottles-x-330-ml

[Mamdouh_USD]

Hi @kate_group, yes.

[Sayed_Safin · Accepted solution]

Assalamualaikum, @Mamdouh_USD , Please follow this steps - 

1. Go to the edit code
2. 
3. search for file section-main-product.css
4. Add the given css code at the bottom of the file.
5. Click on save and check the preview of your store.

Thanks!

@media screen and (max-width: 749px) {
  .product__modal-opener .product__media.media{
     height:32dvh; 
     padding-top:0;
  }
}

[PaulNewton]

@Sayed_Safin use custom css settings first before recommending merchant modify code files.

https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/add-css

Otherwise when a merchant inevitably messes up there theme it wont be a "simple" style it'll be doing free theme repair work.

[Sayed_Safin]

@PaulNewton Thanks for the valuable suggestions.

[Mamdouh_USD]

Waalaikumsalam @Sayed_Safin, 

It worked perfectly. Thank you 🙂