JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
    <li>7</li>
    <li>8</li>
    <li>9</li>
</ul>

CSS

* {margin:0; padding:0;}

ul{
    display: block; 
    background:lightblue; 
    text-align: center;
    margin: 0 auto;
    width: 100%;
    max-width: 740px;
}

li,
ul:after {
    display:inline-block; 
    height:100px; 
    width:100px; 
    background:salmon; 
    margin: 10px;
    position: relative;
    z-index: 1;
}

ul:after {
    content: '';
    height: 0;
    background: none;
    z-index: 0;
    margin: -120px 255px 120px 10px;
}