JSFiddle - React, Tailwind, and code Playground

by Seth Van Booven

HTML

<div></div>
<div id="scaled"></div>

CSS

div {
    background-color: #0f0;
    font-size: 48px;
    height: 200px;
    line-height: 200px;
    text-align: center;
    width: 200px;
}

#scaled {
    -webkit-transform: scale(0.5, 0.5);
}

JavaScript

$('div').each(function() {
    var matrix = window.getComputedStyle(this).webkitTransform,
        data;
    if (matrix != 'none') {
        data = matrix.split('(')[1].split(')')[0].split(',');
    } else {
        data = [1,null,null,1];
    }
    $(this).text($(this).width() * data[0] + 'x' + $(this).height() * data[3]);
});