JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outer">
    <div class="inner">Div1</div>
    <div class="inner">Div2</div>
    <div class="inner">Div1</div>
    <div class="inner">Div2</div>
    <div class="inner">Div1</div>
    <div class="inner">Div2</div>
</div>

CSS

.outer {
    overflow-x:auto;
    width:100px;
    height:100px;
    white-space: nowrap;
}
.inner {
    background-color: lavender;
    display: inline-block;
}
.inner:nth-of-type(2n) {
    background-color: lavenderblush;
}


/* fix for whitespace between inner divs */
 .outer {
    font-size: 0;
    /*set parent font-size to 0 */
}
.inner {
    font-size: 16px;
    /* reset font-size for the actual elements containing text */
}