Using cm for real world size inaccurate. Workaround?

Design help General
1

I want to make an online ruler so that people can measure the circumference of their fingers to be able to determine their ring size.

It works perfectly on a 1920 by 1080 screen but once I move to my macbook which is 2880 by 1800 the ruler has shrunk and I’m missing 2 centimeters of the original 15 centimeter ruler.

Any help will be greatly appreciated.

Here is my site Read-Only:
https://preview.webflow.com/preview/ruler-c2637f?utm_source=ruler-c2637f&preview=442d544892e59020babfd04ecc6b8ed5

2

You can’t, not easily. Not without using code to retrieve information about the size and density of the visitor’s screen.

Google for on-screen rulers, you’ll see they’re using JS to gather details about your screen size before dimensioning a rule for you. Some use machine learning too.