Skip to content

Instantly share code, notes, and snippets.

@zhilinskiy

zhilinskiy/gist:4407138

Created December 29, 2012 14:09
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save zhilinskiy/4407138 to your computer and use it in GitHub Desktop.
Save zhilinskiy/4407138 to your computer and use it in GitHub Desktop.
Download ZIP
CSS: Retina Display Media Query
Raw
gistfile1
/*
http://www.brettjankord.com/2012/11/28/cross-browser-retinahigh-resolution-media-queries/
http://css-tricks.com/snippets/css/retina-display-media-query/
*/
@media only screen and (min-width: 320px) {
/* Small screen, non-retina */
}
@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px),
only screen and ( min-resolution: 192dpi) and (min-width: 320px) {
/* Small screen, retina, stuff to override above media query */
}
@media only screen and (min-width: 700px) {
/* Medium screen, non-retina */
}
@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 700px),
only screen and ( min-resolution: 192dpi) and (min-width: 700px) {
/* Medium screen, retina, stuff to override above media query */
}
@media only screen and (min-width: 1300px) {
/* Large screen, non-retina */
}
@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 1300px),
only screen and ( min-resolution: 192dpi) and (min-width: 1300px) {
/* Large screen, retina, stuff to override above media query */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment