0

iOS is easy, because the pixel-ratio is always either 1 or 2, and the target dpi is always pixels/ratio. Android, however uses 1.3, 1.5, and in some cases 2.25 for a pixel-ratio. I'm not aware of any way to set the target dpi to pixels/ratio for android devices, which would be an easy fix, but I imagine a pixel-imperfect solution for any display whose physical pixel count is an odd multiple of it's dips count (those 1.3's, 1.5's etc).

Right now I'm basically writing css for each -webkit-min-device-pixel-ratio, and just multiplying my px values by that ratio manually (with slight adjustments for rounding). Using ems works great for fonts and a few other things, but I have to use pxs for positioning and sizing of elements if I don't want half, empty, or overlapping pixels.

Is there a better way to do this?

If not, what is the best way to deal with background-images. I really don't want to have to re-write every single background-position for every icon for each ratio simply because I am changing the background-size for each device-pixel-ratio.

bearfriend
  • 10,322
  • 3
  • 22
  • 28

1 Answers1

0

You can try using the viewport meta tag. It lets you match width to the device's width. It also allows you to set initial scaling, set bounds on scaling, or even disable scaling. And here is a link to a relevant Stack Overflow question and answer on using the meta viewport tag.

Community
  • 1
  • 1
  • I actually have the viewport all set up, but the device-width for android devices seems to be physical pixels, not dips. Do you know if that is correct? I guess my problem, really, is my obsession with pixel perfection. I can't stand the idea of having things scaled in some fashion. – bearfriend Feb 06 '13 at 20:57
  • Sorry, I don't have direct experience with that. I think scaling is just a part of modern web design, though. The best alternative that I can think of is using media queries to snap the website to different sized layouts based on the viewport, rather than doing it continuously. – Cthulhufish Feb 07 '13 at 19:58