How can I prevent image size adjustment on my product listing pages?

Store Design
, ,
1

Hi, hopefully someone can help me!

On all my shop listing pages, I’ve got an image of a diagram (‘Why you should Keep your Silver Ray-Ban Box’)

When you resize the page, or even on certain devices, some of the image gets cut-off. I want it all to be visable at all times. How can I do this?

Thanks!

Example on this page:

https://sunglass-studio.co.uk/products/ray-ban-aviator-8217-black-frame-g-15-green-t-140-lens

2

Hi,

The issue is on ipad and tablet view port, its working perfect on desktop, laptop and mobile. The solution to make it responsive also for tablet and ipad are below.

  1. Go to online store

  2. Edit code

  3. Open base.css File

  4. add the following code
    @media screen and (min-width: 750px) {
    .grid–1-col .grid__item {min-width: 100% !important}
    }

  5. Save

That should solve the problem.

Have a nice day.

3

Unfortunately all it did was make the photo take up the screen. I adjusted the sizes in your code, but it did not make a difference.