Skip to content

Instantly share code, notes, and snippets.

@kaelig

kaelig/hidpi.css

Created September 13, 2012 13:54
Show Gist options
  • Save kaelig/3714468 to your computer and use it in GitHub Desktop.
Save kaelig/3714468 to your computer and use it in GitHub Desktop.
Download ZIP
Hidpi / Retina CSS media query
Raw
hidpi.css
@media (-webkit-min-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6/2),
(min--moz-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
// Hi-dpi visuals
}
Raw
retina-mixin.scss
@mixin hidpi {
$hidpi-debug: false !default;
@if $hidpi-debug {
@content;
} @else {
@media (-webkit-min-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6/2),
(min--moz-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
@content;
}
}
}
@kaelig
Copy link
Author

kaelig commented Oct 27, 2012

Now a real project, see https://github.com/kaelig/hidpi

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment