Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it possible to get real inches with CSS? [duplicate]

Is it possible to draw an element, say a div, to a width in inches and have a reasonable likelihood that the element will in fact, be that width (in inches), especially when moving to other devices?

Or is the answer to this, simply, no, and you'll end up with scale like 1in = 96px

Edit: Try using CSS inches on an element and then hold up a ruler to the element and see my dilemma

Edit: In 2014, do I really have to have my users hold up a ruler to the screen to get the ratio I need?

Edit to reopen:

I am creating an app where one of the elements MUST be (per requirements of the application) a fixed width in inches across different devices - limited to tablets and desktops (screen no less than 1024 x 768). I have seen answers suggesting you need to have your users physically measure and calibrate this area to give you a ratio that can be used with px. Is this really the only way to do this? Having your users hold a ruler up the screen?

Edit: Why do I need to do this, some people have asked? I am taking a product which does exist in the physical world and virtualizing it - this product requires human interaction and scaling the sizes does not work, it must remain at a fixed width across devices.

like image 318
user602525 Avatar asked Jan 06 '14 17:01

user602525


3 Answers

Yes, it's possible--measurements like in, cm, and mm are accepted. The conversion from the length to a number of pixels is handled by the system. The W3C doesn't recommend them for use on screens, though, since the machine in question has to support the conversion.

Note that if the anchor unit is the pixel unit, the physical units might not match their physical measurements. Alternatively if the anchor unit is a physical unit, the pixel unit might not map to a whole number of device pixels.

Note that this definition of the pixel unit and the physical units differs from previous versions of CSS. In particular, in previous versions of CSS the pixel unit and the physical units were not related by a fixed ratio: the physical units were always tied to their physical measurements while the pixel unit would vary to most closely match the reference pixel. (This change was made because too much existing content relies on the assumption of 96dpi, and breaking that assumption breaks the content.)

(Source: http://www.w3.org/TR/CSS21/syndata.html#length-units)

like image 107
Milo P Avatar answered Sep 21 '22 12:09

Milo P


Using inches in CSS is possible (literally 1in) but isn't always accurate, since the browser, operating system, and monitor all have to work out perfectly to do it. The accuracy always depends, but on my monitor it is usually about half an inch off. Perhaps my answer here may help you. There's no 100% accurate failsafe method, but then again, that's because it isn't exactly the most useful thing to have in your CSS. Dealing in pixels normally works just as well.

like image 22
hkk Avatar answered Sep 17 '22 12:09

hkk


You can use in but result still depends on the correct reading of the monitor size by the operating system. There are problems with pixel density of screen which is hard to calculate exact.

Check this link http://www.w3.org/TR/CSS21/syndata.html#length-units

like image 30
gorgi93 Avatar answered Sep 20 '22 12:09

gorgi93