Skip to content

Instantly share code, notes, and snippets.

@apan2017
Created December 1, 2017 06:17
Show Gist options
  • Select an option

  • Save apan2017/b409600ad3d7ef142a9827fbdb63b32c to your computer and use it in GitHub Desktop.

Select an option

Save apan2017/b409600ad3d7ef142a9827fbdb63b32c to your computer and use it in GitHub Desktop.
iPhone 6 Plus & iPad Air 2 media query (Retina HD displays). Also works for similar Android devices.
/* iPhone 6 Plus & iPad Air 2 media query (Retina HD displays).
Also works for similar Android devices. */
/* Use x2 images by default. */
.logo {
background-image: url(http://hellyeah.is/images/text-logo-ns@x2.png);
height: 300px;
width: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
/* Use x3 images for iPhone 6 plus and similar devices */
@media only screen and (-webkit-min-device-pixel-ratio: 3),
only screen and (min-resolution: 3dppx), /* Default way */
only screen and (min-resolution: 350dpi) /* dppx fallback */ {
.logo {
background-image: url(http://hellyeah.is/images/text-logo-ns@x3.png);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment