Sprites and Retina Displays

Avatar of Chris Coyier
Chris Coyier on

DigitalOcean joining forces with CSS-Tricks! Special welcome offer: get $100 of free credit.

CSS sprites are often used for small icons. That is exactly what looks bad on retina displays. Maykel Loomans has a way to deal with that that doesn’t make our CSS twice as complicated: 1) Make sprite exactly twice as big 2) Swap out background in media query 3) Shrink background-size in half so coordinates are still correct.

Direct Link →