Skip to content

Instantly share code, notes, and snippets.

@nmsdvid
Created January 17, 2013 20:07
Show Gist options
  • Save nmsdvid/4559253 to your computer and use it in GitHub Desktop.
Save nmsdvid/4559253 to your computer and use it in GitHub Desktop.
Retina Background Image w CSS
/* for low resolution display */
.image {
background-image: url(/path/to/my/lowreslogo.png);
background-size: 200px 300px;
height: 300px;
width: 200px;
}
/* for high resolution display */
@media only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {
.image {
background: url(/path/to/my/highreslogo.png) no-repeat;
background-size: 200px 400px;
/* rest of your styles... */
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment