html - image quality deteriorates when used more than once -

in html page, include image as

<img src="http://i44.tinypic.com/w2o9kh.png" border="0" alt="image tinypic"> 

i style external css by

img {width:2em;height:2em; } 

however notice image quality deteriorates when same image used more once in page. compare http://jsfiddle.net/aj333/50/ , http://jsfiddle.net/zxgqr/ in firefox. quality of smiley worse in first one.

any insight on why happens , how retain quality ?

p.s. ive checked happens if images in different div containers.

p.s. seems browser specific:
in chrome both quality
in ie9 both bad quality
in firefox quality of smiley worse in first fiddle. work in firefox @ least.

im novice in html please bear in case obvious

you setting height , width value on images. if values bigger or smaller actual dimensions of picture, browser must scale it. process changes resolution of picture making blurry.