JSFiddle - React, Tailwind, and code Playground

HTML

<div class="ui-tablewrapper">
<div class="ui-tablebanner" id="ui-tablebanner-30">1</div>
<div class="ui-tablebanner" id="ui-tablebanner-26">2</div>
<div class="ui-tablebanner" id="ui-tablebanner">3</div>
</div>

CSS

.ui-tablewrapper {
    position:relative;
    width:100%;
    color:#000;
    font-size: 0;
}
.ui-tablebanner {
    display:inline-block;
    margin-right:1px;
    color:#000;
    border:1px solid #000;
    height: 25px;
    font-size: .75rem;
    box-sizing: border-box;
}
#ui-tablebanner-26 {
    width: 26px;
    position: absolute;
    left: 31px;
    
}
#ui-tablebanner-30 {
    width: 30px;
    position: absolute;
    left: 0;
}
#ui-tablebanner {
    position: absolute;
    left: 58px;
    right: 0;
}