-1

I have a container with every measurement defined in 'mm' for printing purposes. However, I want to show its preview inside a 600px wide block with perfect fit. What would be the best way to scale it down?

shikharsaxena30
  • 155
  • 2
  • 3
  • 13

3 Answers3

12

The millimiter to pixels and vice-versa formula takes the DPI of the screen into consideration.

DPI meaning dots-per-inch.

There's no truth in mm to pixels unless you have a stable DPI value you can use.

Anyway, this is the formula:

mm = (pixels * 25.4) / dpi

The most-usual seen DPI values seen are 72 and 96 if I'm not mistaken, but since this is for print it will most likely depend on the device settings

nicholaswmin
  • 21,686
  • 15
  • 91
  • 167
  • I'm aware of this conversion. But as you said, it takes the DPI into consideration. What would be the best solution to scale it irrespective of the DPI? I know it can be done with JavaScript easily, but I was wondering if there's a better solution. – shikharsaxena30 Dec 31 '14 at 22:00
  • scale what down? You can't scale it to a real world size without knowing the DPI. Meaning you *can't show it in real world size* without knowing the DPI and Javascript has no way of detecting the current DPI value of a user or a printer – nicholaswmin Dec 31 '14 at 22:02
  • Any way to do it with pure CSS? Just need to scale the width of the div from 250mm to 600px. – shikharsaxena30 Dec 31 '14 at 22:06
  • CSS takes *pixels* as measurement units, not *millimiters*. If you just want to scale your div using javascript 2.4 times you can use `document.getElementByID('yourDivId').style.width = 600px`; – nicholaswmin Dec 31 '14 at 22:08
  • Thanks. Just wanted to confirm if there's a way to do it with css transform. – shikharsaxena30 Dec 31 '14 at 22:12
  • `document.getElementById("yourDivId").style.transform="scale(2.4,2.4)";`. But that's only on CSS3 browsers and webkit needs it's own prefix. See this [link](http://stackoverflow.com/questions/708895/how-to-set-the-style-webkit-transform-dynamically-using-javascript) – nicholaswmin Dec 31 '14 at 22:15
5

I found this website that converts pixels to mm or vice versa: http://www.unitconversion.org/typography/millimeters-to-pixels-y-conversion.html

According to it, 600px is approximately 159mm.

However there is a problem. Pixel size depends on the resolution of the screen so I'm not really sure how that website came up with its conversion.

Rich McCluskey
  • 1,871
  • 2
  • 18
  • 30
5

1 millimeter = 3.779527559055 pixel

therefore: 600px/3.7xxxx = 158.75

veeraB
  • 71
  • 2