JSFiddle - React, Tailwind, and code Playground

HTML

<section>
<div class="">Content</div>
<div class="">Content</div>
<div class="">Content</div>
<div class="">Content</div>
<div class="">Content</div>
<div class="">Content</div>
<div class="">Content</div>
<div class="">Content</div>
</section>

CSS

body {
    margin:0;
    overflow: hidden;
}
section {
    word-spacing: -4px;
    overflow-x: scroll;
    overflow-y: hidden;
}
div {
    box-shadow: 0 0 0 1px #000 inset;
    display: inline-block;
}

JavaScript

$(window).on('resize',function(){
    winX = $(window).width() - 0;
    winY = $(window).height() - 0;
    len = $('div').length;
    
    xxxX = winX / 3;
    xxxY = winY / 1;
    
    $('section').height(xxxY);
    
    $('div').each(function(e){
        $(this).width(xxxX);
        $(this).height(xxxY);
    });
    
});