JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <ol>
        <li class='a'>#include&lt;stdio&gt;</li>
        <li class='b'>&nbsp;</li>
        <li class='c'>int main()</li>
        <li class='d'>{</li>
        <li class='e'>    printf( "Hello World Hello World Hello World Hello World Hello\n" );</li>
        <li class='f'>    return 0;</li>
        <li class='g'>}</li>
    </ol>
</div>

CSS

div {
    width: 400px;
    overflow-x: scroll;   
}

ol {
    /* min-width: 100% !important; */   
}

li {
    /* min-width: 100%; */
    w/* hite-space: nowrap; */
    display: table-row;    
}

.a, .c, .e, .g {
    background-color: red;
}

.b, .d, .f {
    background-color: blue;
}