How to make Image fit on the page in refresh theme

seiza123 · ‎09-08-2024

Hello,

I am wondering if there is a way to make an image 'fit to size' on both desktop and mobile in the refresh theme.

please refer to images so you can understand

Dan-From-Ryviu · ‎09-08-2024

Please add this code to Custom CSS of that section and check again

@media (max-width: 749px) {
img { object-fit: contain; }
}

If it is still not working, please share your store URL so I can check.

- Helpful? Like and Accept solution! or Buy me coffee
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

View solution in original post

Dan-From-Ryviu · ‎09-08-2024

Hi @seiza123

Please add this code to Custom CSS of that section and check again

@media (max-width: 749px) {
img { object-fit: contain; }
}

If it is still not working, please share your store URL so I can check.

- Helpful? Like and Accept solution! or Buy me coffee
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

seiza123 · ‎09-10-2024

this worked very well. thankyou. Only issue is a different colour background behind the image

Vinsinfo · ‎09-09-2024

@seiza123 Please share your store URL to help you on this.

Please reach out to [email protected] for any enquires related to Shopify.
Our Services: Custom Theme Development, Theme Customization, Custom Feature Implementation, Data Migration, Custom APP Development, Website Optimization and Google Merchant Center Support

How to make Image fit on the page in refresh theme

How to make Image fit on the page in refresh theme

Community Blog Articles