JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container"  style="width:100%;height:100%;">
    <div class="row" style="width:95%;height:87%;">
    </div>
</div>

<div class="message"><strong>Message:</strong></div>

CSS

.row { background-color:red }

.container { background-color:green }

JavaScript

$('.message').append("<br />$('.row').width() is returning <b>" + $('.row').width() + '</b> when Container is hidden.');
$('.message').append("<br />$('.row').height() is returning <b>" + $('.row').height() + '</b> when Container is hidden.');
$('.container').show();
$('.message').append("<br />$('.row').width() is returning <b>" + $('.row').width() + '</b> when Container is shown.');
$('.message').append("<br />$('.row').height() is returning <b>" + $('.row').height() + '</b> when Container is hidden.');