Skip to content

Instantly share code, notes, and snippets.

@monochromer
Last active August 29, 2018 08:35
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 monochromer/1a25364fa5e7acd4a964 to your computer and use it in GitHub Desktop.
Save monochromer/1a25364fa5e7acd4a964 to your computer and use it in GitHub Desktop.
retina media query
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 144dpi) { ... }
// retina media query mixin
retina(factor = 2)
@media (-webkit-min-device-pixel-ratio: factor), (min-resolution: factor * 96dpi), (min-resolution: factor * 1dppx)
{block}
// example
.header
+retina(1.25)
background-color #ccc
+retina(1.5)
background-color #eee
+retina(2)
background-color #fff
+retina()
background-color #000
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment