When viewed on a mobile my images respond to the page size, but on a desktop the don't do this.

Is there a way to make them respond to the screen size so that I can use 1100px images without them looking huge on the page?

I'm guessing that this is something to do with the css but I've been trying various things for about an hour and nothing is working so if someone could help me with the correct code and where to put it that would be great.

Here is an example of an image giving me a problem.
https://www.lastingtouch.co.uk/Ashes-in-Resin-Silver-bead

Thanks

Hi Gemma

What I usually do is have this in my css file

img.detailimage{
max-width:100%;
height:auto
}

Andy

Please feel free to review / rate our software

If I may ask, why are you using such a large image? You could easily crop it down. Such a large image is simply going to increase your pages' download time.

Marshall
CENLYT Productions - ms designs
Affordable Web Design
Custom Ecommerce Designs
Responsive Websites
Cenlyt.com

Thanks Andy, that has worked.

Marshall, my main reason was because I was finding that when sharing my links on social media (particularly facebook), I was finding that only a small thumbnail was appearing, with a bit of research it seems that facebook wants a 1080px image for it's image links.

Also, my products carry a lot of detail, so large images are important to my customers. I do optimise my images to keep the file size down even though the actual display size is quite large so I don't think load time is a problem.