JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://getfirebug.com/firebug-lite-debug.js"></script>
<div class="box"></div>
<div class="content"></div>
CSS
div {
height: 120px;
width: 100px;
padding-top: 20px;
padding-left: 10px;
background-color: #abc;
border: 1px solid black;
}
.box {
box-sizing: border-box;
-moz-box-sizing: border-box;
}
JavaScript
console.log("jQuery v" + $.fn.jquery);
showDimensions('box');
showDimensions('content');
function showDimensions(cls) {
var elm = $('.' + cls),
label = "$('." + cls + "')";
console.log(label + ".height() = " + elm.height());
console.log(label + ".css('height') = " + elm.css('height'));
console.log(label + ".width() = " + elm.width());
console.log(label + ".css('width') = " + elm.css('width'));
}