Sizing image properly for iOS retina and non-retina screens
How could my 640x960 images for the iPhone retina screen also be usable for the earlier 320x480 screen? They should fit the screen neatly in both screen sizes; right now the image exceeds the smaller screen instead of shrinking to fit. (Application: tapping a thumbnail of the image should enlarge it to fill the screen for wallpaper capture on either device.)
iOS does not automatically scale your images. So you you have to have a 320x480 image called image.png. Then the same image double the size called firstname.lastname@example.org. You have to have double of all your images to support both devices.
Why does it not shrink to fit, did you apply max-width:100%; ?
There is another technique you could use where you embed a transparent gif as the image src and then apply different background images within the media queries to target different screen sizes, serving up the correct image with the correct dimensions.