JSFiddle - React, Tailwind, and code Playground

by Denis Ineshin

HTML

<div class="test">

</div>

CSS

.test {
    height: 100px;
    padding: 10% 0;
    background: #000;
    border: 10px solid #f00;
}

JavaScript

var $test = $(".test");
var height = $test.outerHeight();

var padding = parseFloat(getComputedStyle($test[0]).paddingTop);
var border = parseFloat(getComputedStyle($test[0]).borderTop);
var height2 = parseFloat(getComputedStyle($test[0]).height) + (padding * 2) + (border * 2);

console.log(height, height2);