JSFiddle - React, Tailwind, and code Playground

by darcyclarke

HTML

<section>
    <article>
        
    </article>
</section>

CSS

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

section {
 width: 100%;
 height: 100%;
 position: absolute;
 display: block;
 overflow: scroll;
 border: 1px solid blue;    
 padding: 10px;
}
article {
 width: 200%;
 height: 100%;
 position: relative;
 border: 1px solid red;
 background: #ccc;   
}

JavaScript

var section = $('section')[0];
console.log('scrollWidth=', section.scrollWidth);

$(window).on('resize', function(){
    setTimeout(function(){ 
        console.log('resize - scrollWidth=', section.scrollWidth);
    }, 0);
    
});