JSFiddle - React, Tailwind, and code Playground

HTML

<h3>no hack</h3>

<div class='list-container'>
    <div class='list'>
        
        <div class='item'></div>        
        <div class='item'></div>
        <div class='item'></div>
        <div class='item'></div>
        <div class='item'></div>
        <div class='item'></div>
        <div class='item'></div>
    </div>
</div>


<h3>with hack</h3>

<div class='list-container'>
    <div class='list hack'>
        
        <div class='item'></div>        
        <div class='item'></div>
        <div class='item'></div>
        <div class='item'></div>
        <div class='item'></div>
        <div class='item'></div>
        <div class='item'></div>
    </div>
</div>

CSS

.item {
    width: 4em;
    height: 4em;
    background-color: skyblue;
    border: 1px solid black;
}

.list-container {
    width: 15em;
    padding-left: auto;
    background-color: grey;
}

.hack {
    margin-left: 1.5em;
}

.list {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: yellow;
    flex-shrink: 10;
    flex-basis: 15em;
    width: auto;
}