JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div id="rows"></div>
    <div id = "rowstwo"</div>
</div>

CSS

#container {
    width: 200px;
    height: 300px;
    background: red;
    position: relative;
}
#rows {
    position: absolute;
    width:50%;
    top: 30px;
    bottom: 20px;
    background: green;
}
#rowstwo
{
  
}

JavaScript

$().ready(function () {
    var $container = $('#container');
    var height = $container.height();
    var width = $container.width();
    $('#container').before('<p>Container Size: ' + width + ' x ' + height + '</p>');

    var $rows = $('#rows');
    height = $rows.height();
    width = $rows.width();
    $('#container').before('<p>Rows Size: ' + width + ' x ' + height + '</p>');
});