Retina / High DPI Displays

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Jacob Dunn

    (@spacemanspud)

    That’s the very thing this plugin was built for! You provide media queries for the image resizes in the same way you do for stylesheets. From the contextual help:

    (min-width:420px) and (min-device-pixel-ratio:2)

    The above query matches any retina display (2x pixel density) device with a minimum browser width of 420px. Additionally, the min-device-pixel-ratio query will automatically have vendor prefixes applied to it.

    All you have to do is make sure your original image is sized correctly for retina, and this plugin will take care of sizing it down for all other resolutions and sizes.

    Hope that helps!

    Thread Starter jloft

    (@jloft)

    Aha! Thank you. I was overlooking that I could insert something like (min-device-pixel-ratio:2) in the “media” field.

    Plugin Author Jacob Dunn

    (@spacemanspud)

    Glad I could help!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Retina / High DPI Displays’ is closed to new replies.