Saturday, January 3, 2009

Make scaled images render nicely in IE

A colleague just noted this blog post in his RSS feed and I thought it was worth sharing on here (and for my own future reference).

If you force an image to a certain size via its width and height attributes in HTML or CSS, most browsers will handle this ok and display the scaled image reasonably nicely, but in IE the edges often look pixelated and jagged.

To fix this, just add the following to your CSS:

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

I shall be adding this to my reset stylesheet ASAP.

No comments: