AdamBrodzinski / Retina-Sprites-for-Compass

A mixin for creating retina sprites with hover & active states
MIT License
233 stars 35 forks source link

Retina sprites appearing blurred on iOS #28

Open howells opened 11 years ago

howells commented 11 years ago

Hi -

I have a super strange problem that I haven't seen before, even though I have used your mixin on multiple projects with no problem.

On my Retina Macbook Pro, everything works as expected, but on iOS—iPhone 4, 5, and iPad—the retina sprites look blurry, even though when I inspect via Safari the right retina sprite image is being loaded.

The site in question is http://pca.kulor.net if you want to take a look. Can you see what is going on? It's driving me nuts!

howells commented 11 years ago

I discovered the problem was because one of the individual sprites was 1300px wide: when it was removed and teh sprite map regenerated, everything worked fine.

AdamBrodzinski commented 11 years ago

Oh wow that's a big sprite! I didn't realize there was a width limitation.

novascreen commented 10 years ago

in terms of limitation there is also a limit where iOS is just not loading the sprite at all, it might be something like 3 mega pixels. To avoid that you should try to not mix small icons and things that are very wide, create a sprite with all the small icons and create one with the very wide images like logos or sth. Because Compass creates the sprite vertically one wide icon will blow up the total resolution of the sprite immensely.