BCW
BCW

Reputation: 43

Resizing images based on their original size with CSS

I'm making a responsive blog for both mobile and desktop users (all in one). With respect to image resizing, I understand that I can use width:100%; height:100%; so that they scale proportionally depending on the page size, but I've noticed that smaller images upscale to fit the width of the DIV that it is in. Let's say my DIV has a max-width of 640px but an image I include within it in 500px.

What CSS can I use to keep the image at 500px and then scale down proportionally if the resolution width falls below 500px?

The reason I'm asking this is because not all images in posts may be 640px wide.

Upvotes: 1

Views: 402

Answers (2)

MikeSmithDev
MikeSmithDev

Reputation: 15797

Why don't you just set max-width:100% and leave width off.

Upvotes: 0

Ryan
Ryan

Reputation: 28187

Set your image max-width property to the actual image size.

Upvotes: 2

Related Questions