Tip: High quality CSS thumbnails in IE7

IE7 supports a custom bicubic resampling mode for images. Before, resizing a 500×500 image like this:

<img src="pic.jpg" alt="This image is really 500x500 big" class="thumb" width="50" height="50" />

would produce a horrible result in IE, with noticeably lower quality in the resized version.

This is easily fixed in IE7 by applying the following property to the img tag:

img.thumb { -ms-interpolation-mode: bicubic; }

Go to this demo page for a Flickr picture example.

This post has 34 responses