JSFiddle - React, Tailwind, and code Playground

HTML

<div id='container'>
    <div id='content'></div>
</div>
<div id='size1'></div>
<div id='size2'></div>

CSS

#container {
    overflow: auto;
    width: 300px;
    height: 300px;

}
#content {

    width: 100%;
    height: 300px;
}

JavaScript

$('#container')
    .css('overflow', 'hidden')
    .each(function(){
        this.style.display='none';
        this.offsetHeight; 
        this.style.display='block';
    });

$('#size1').text('Inner element size at runtime: ' + $('#content').width());
$('#size2').text('Outer element size at runtime: ' + $('#container').width());