JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <div id="viewport">
        <div id="content">
            <div class="item"></div>
            <div class="item"></div>
            <div class="item"></div>
        </div>
    </div>
</body>

CSS

#viewport {
    position: absolute;
    min-width: 400px;
    height: 200px;
    /* overflow: hidden; Removed to show how the items are being layed out */
    border: dashed black 1px;
}
#content {
    white-space: nowrap;
    border: solid red 1px;
}

.item {
    display: inline-block;
    width: 200px;
    height: 200px;
    border: solid black 1px;
}