JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper light-olive">
        <div class="content">
            <div class="item">
                Fancy content goes here.
            </div>
            <div class="item">
                Fancy content goes here.
            </div>
        </div>
    </div>

CSS

.wrapper{
    width: 320px;
    height: 100px;
    
    background: blue;
    overflow-x:scroll;
    overflow-y: hidden;
}

.content{
   width: auto;
   white-space:nowrap; 
}

.item{
    display: inline-block;
    background: red;
    
    width: 300px;
    height: 100px;
}