Question

I’m working on a fluid layout and I’m having trouble with scaling images. I’ve been using absolute width and height lately, but that’s causing problems in many instances.

My source image is 1642px wide by 760px high.

Is there a way to do something involving percentages, much like you can proportionally scale an image in Photoshop? Say I want the image’s height to be the same as the height of its container, but the width to be proportional in that sense.

Answer 1

All you need to do is specify only image height, and width will scale proportionally.

img{
    height:100px;
}

Check working example at http://jsfiddle.net/jncnE/