JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="box a">A</div>
    <div class="box b">B</div>
    <!-- <div class="box c">C</div> -->
</div>

CSS

.wrapper {
    overflow: hidden;
    width: 500px; 
    /* white-space: nowrap; */
}

.a {
    margin-left: 0px;
    width: 200px;
    display: inline-block;
}

.b {
    margin-left: 0px;
    width: 200px;
    display: inline-block;
}

.c {
    margin-left: 200px;
    width: 200px;
    display: inline-block;
}


/* non-essentail decorative styles */
.wrapper { background-color: orangered; height: 500px; }
.box {  height: 220px; background-color: #aaa; text-align: center; font-size: 1.5em;}