I don’t think so, please try e.g. cm sized boxes in your desktop browser. (Mind that you could have erroneous custom screen settings.)
I’ve used mm as unit for product images of wedding rings, iirc it worked well in different screens and browsers.
I will give it a go and report back.
I never had need to use physical units so never tried it.
1 Like
This is my test page:-
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name=viewport content="width=device-width, initial-scale=1">
<title>Page Title</title>
<style>
.cm2 {
--size: 2cm;
}
.cm3 {
--size: 3cm;
}
.cm4 {
--size: 4cm;
}
.cm5 {
--size: 5cm;
}
.cm6 {
--size: 6cm;
}
.box {
display: flex;
flex-wrap: wrap;
list-style: none;
}
.box li {
margin: 5mm;
background: red;
width: var(--size);
height: var(--size);
}
</style>
</head>
<body>
<ul class="box">
<li class="cm2"></li>
<li class="cm3"></li>
<li class="cm4"></li>
<li class="cm5"></li>
<li class="cm6"></li>
</ul>
</body>
</html>
Measuring on my monitor the boxes are bit over size, the 6cm one being 63mm.
Ideally I would have a range of display devices to check, but I just have twin monitors the same size.
The size is close, but not accurate, I guess the browser is quessing the PPI.
Maybe if a few people with different displays test with the same code we can get an estimete on how reliable these units are. It may be close enough for the OP’s needs.
Though I still feel they should do as we all do and base the design around the design, not devices.
Edit Added a Codepen version:-
IMHO, the only time physical units might be needed would be for print media CSS.
1 Like
On my monitor they are about a 1cm smaller at the largest size. On my iphone they are nearly 50% out.
This method cannot be relied upon as cm or mm is not the real world cm or mm that we know and would still have the same issues as before in that it does not take into account the design.
I’m guessing that the issue is simply that on smaller devices with higher resolution the layout looks smaller although it is in fact the same layout. It still sounds like a design issue to me and not a specific device issue. You can’t change a pixel to mean different things (ignoring double density etc as that is a separate topic).
3 Likes
I’m on a LinuxMint Mate box and my 1920x1080 px screen is set to 119 PPI in Apperance-Fonts-resolution (Gimp calibration says 119.529x119.329).
On my 119 PPI screen the 6 cm box is 5.75 cm. My additional 10cm (3.937 in) box is 9.6 cm.
If I set the screen to 120 PPI the largest box is 6.25 cm. My additional 10cm (3.937 in) box is 10.4 cm.
All browsers I’ve tested in are built on Chromium.
Neither is exactly the size. What a print out wold show would be interesting, but I can’t connect to a printer from where I am atm.
(On my first desktop publishing machine, an Atari Mega 4 running Calamus with an A4 portrait screen and an Atari SLM804 laser printer, I would have measured the screen and the print to be within a 1/10 mm at that length. Sigh…)
1 Like
That seems to show the units are inconsistent and unreliable as I first assumed.
After Erik’s encouragement and my initial test I did believe it may be possible the browser has a reasonable guess at your PPI and defines real world units “within a ball park” but your results and the statement in the article that units have a rigid relationship confirm on-screen physical units are unreliable.
With that rigid relationship between the units using cm, mm or in for queries would make absolutely no difference to where the breakpoints occur on different devices to using px equivelent measurements.
3 Likes
I agree. 
My point was only to use the Samsung Notepad’s own report to the browser what size its screen is. I thought he could use the script to ask for the DPI and size of the screen.
Otherwise he could visit http://browserspy.dk/screen.php with the device and see what the browser tell the site about its screen, width and height both in px and DPI.
1 Like
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.