I try to create a website with mind size device. I overwhelmed with today device. the resolution that need to work with so many, and will increase with high resolution. but, the pychical dimension still same around 50mm - 70mm width for mobile. Is 1in unit stable to measure inch?

<div id="container">
            Iphone 4s dimension
</div>
<script>
function mmInPixel() {
    const e = document.createElement("div");
    e.style.width = "1in";
    document.body.appendChild(e);

    const pixel = (screen.width / ((screen.width / e.offsetWidth) * 2.54 * 10));
    document.body.removeChild(e);
    
    return pixel;
}

const container = document.getElementById("container");
const width = (mmInPixel() * 49);
const height = (mmInPixel() * 74);
container.style.width = `${width}px`;
container.style.height = `${height}px`;
container.style.backgroundColor = "black";
container.style.color = "white";
container.style.margin = "auto";