Pixelation in iOS4 but not iOS5

Question

I have an image tag with width attribute in px in my html. Running this html in iPad having IOS4 results in a clear image whereas in IOS5 it looks pixelated. Please suggest.

Answer 1

I chose to follow the naming convention Apple uses in its SDK to target the high-res images by adding the suffix “@2x” to the file-name. So for low-res devices, if the standard icon is “icon.png”, the RD devices would be “icon@2x.png”. To get these into the mix, I added a media query into the css file that targets the Retina Display:

@media all and (-webkit-min-device-pixel-ratio: 2) {
    #home-news a {background-image:url(images/icon@2x.png);}
}