JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <body>
        <span id="info"></span>
        <div id="one">1</div>
        <div id="two" style="margin-left: 50px;">2</div>
    </body>
    
</html>

CSS

div {
    -moz-transform: scale(0.5);
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    border: 1px solid red;
    height: 200px;
    width: 200px;
}

JavaScript

$(document).ready(function() {

    var o = $("#one").offset(), t = $("#two").offset(),
        oh = $("#one").outerHeight(),   
        th = $("#two").outerHeight();        
        
    $("#info").html("one: " + o.left + "," + o.top + ", height " + oh + " two: " + t.left + "," + t.top + ", height " + th);
    
});