JSFiddle - React, Tailwind, and code Playground

HTML

<div id='log' style="position:fixed;right:0;top:0;"></div> 
<br /><br /><br /><br /><br />
<br /><br /><br /><br /><br />
<br /><br /><br /><br /><br />
<div style="

-o-transform:translate(130px, -200px) skew(0deg, 0);
-webkit-transform:translate(130px, -100px) skew(0deg, 0);
-moz-transform:translate(130px, -200px) skew(60deg, 0);
-ms-transform:translate(130px, -200px) skew(60deg, 0);

">
<div id="clickMe" style="border:10px solid silver;
padding: 0px;
-moz-transform:rotate(25deg);
-ms-transform:rotate(25deg);
-o-transform:rotate(25deg);
-webkit-transform:rotate(490deg);
left:0;top:0;
width:100px;
height:50px;" > 120px x 70px</div>

</div>

JavaScript

(function () {
 
  function multiply(a, b) {
    var r = [], i, j, k, t;
    for (i = 0; i < a.length; i++) {
      for (j = 0; j < b[0].length; j++) {
        t = 0;
        for (k = 0; k < a[0].length; k++) {
          t += a[i][k] * b[k][j];
        }
        r[i] = r[i] || [];
        r[i][j] = t;
      }
    }
    return r;
  }
 
  function translate(m/*, tx, ty, tz*/) {
    var i, r = [];
    for (i = 0; i < m.length; i++) {
      r[i] = m[i].slice(0);
      r[i][m[i].length - 1] += +arguments[1 + i] || 0;
    }
    return r;
  }
 
  function matrixFromCssString(c) {
    c = c.match(/matrix3?d?\(([^\)]+)\)/i)[1].split(',');
    if (c.length === 6) {
      c = [c[0], c[1], 0, 0, c[2], c[3], 0, 0, 0, 0, 1, 0, c[4], c[5], 0, 1];
    }
    var i, j, m = [];
    for (i = 0; i < 4; i++) {
      for (j = 0; j < 4; j++) {
        m[i] = m[i] || [];
        m[i][j] = parseFloat(c[j * 4 + i]);
      }
    }
    return m;
  }
 
  function boundingClientRect(element, transformationMatrix) {
    var points = multiply(transformationMatrix, [
      [0, element.offsetWidth, 0, element.offsetWidth],
      [0, 0, element.offsetHeight, 0, element.offsetHeight],
      [0, 0, 0, 0],
      [1, 1, 1, 1]
    ]);
 
    return {
      left:   Math.min.apply(Math, points[0]),
      top:    Math.min.apply(Math, points[1]),
      right:  Math.max.apply(Math, points[0]),
      bottom: Math.max.apply(Math, points[1])
    };
  }
 
  var buggy = function () {
    var div = document.createElement('div'), rect, result;
    div.style.cssText = 'width:200px;height:200px;position:fixed;-moz-transform:scale(2);';
    document.body.appendChild(div);
    rect = div.getBoundingClientRect();
    result = !!('\v' !== 'v' && getComputedStyle(div, null).MozTransform && (rect.bottom - rect.top < 300));//!
    div.parentNode.removeChild(div);
    div = null;
    rect = null;
 
    buggy = function () { return result; };
    return buggy();
  };  
 
  function getTransformationMatrix(element) {
    var...