Need Help with Responsive Images in Product Descriptions

Shopify Discussion
,
1

Hi everyone,

I’m trying to adjust the size of images within the product description section (not the main product image grid). The images look great on desktop but appear compressed and distorted on mobile. When I resize them to fit mobile screens, they end up too small on desktop.

Could someone share a snippet of CSS code I could add to my theme’s Custom CSS to make these images responsive and display properly on both mobile and desktop?

For reference, I’m using the Empire theme, and my store’s homepage is https://www.astralwingdrones.com/.

Thanks in advance for your help!

2

Hey @PD31

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1732336172136.png
Moeed_0-1732336172136.png374×655 89.8 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

3

It worked! Thank you so much @Moeed . You’re a G

4

Thank you for your reply. I’m glad to hear that the solution worked well for you. If you require any more help, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.