Why is Firefox so bad at resizing images?

Question

On the left is the original PNG and on the right are versions reduced to roughly half the orignal size using and height. See [Link re

Answer 1

I know this is late, but you can trick firefox into rendering the image better by applying a oh-so-slight rotation. I tried to translate() the image to get the same effect... to no avail.

CSS

.image-scale-hack {
    transform: rotate( .0001deg );
}

Javascript

if( "MozAppearance" in document.documentElement.style ) {
    $('.logo img').addClass('image-scale-hack');
}

I avoid browser sniffs at all cost. I borrowed this sniff from yepnope.js and I don't feel bad about it.

Also noteworthy, this same trick can be used to force sub-pixel image rendering in both webkit and firefox. This is useful for very slow animations - best explained by example:

http://jsfiddle.net/ryanwheale/xkxwN/