CODEWITHSUNDEEP
htmlcss
Rob Sedgwick
Rob Sedgwick

Reputation: 4514

Sizing large but not small images to fit on a html table

I have a table which can contain images which can be bigger than a table cell. What I have done is truncate the images so that they don't expand the table (using table-layout: fixed).

http://jsfiddle.net/GrimRob/wy0skbmn/

What I would like to do is size the image so that it fits on the table. I have commented this out in my fiddle:

img.imgcode {
    width: 100%;
    height: auto; 
}

this works fine for a large image like in my example, but in the case the image is smaller than the td it increases the size of the image.

What I want is to resize the image, but only if it is not too large. If it fits already I don't want to resize it. Is this possible?

Upvotes: 0

Views: 49

Answers (1)

AlexG
AlexG

Reputation: 5929

try this:

img.imgcode {
    display: block;
    max-width: 100%;
    height: auto;
 }

Upvotes: 1

Related Questions