JSFiddle - React, Tailwind, and code Playground

HTML

<div class="main">
    <div id="a">
       <div class='c'></div>
    </div>
    <div id="b">        
    </div>
 </div>
<input type="range" onchange="document.querySelector('.c').style.width = this.value + 'px'" min="0" max="400" value="50">

CSS

.main{
    display: table;
}
#a,#b{
    display:table-cell;
}
#b{
    width: 100%;
    background: blue;
}
.c {
    height: 50px;
    width: 50px;
    padding: 10px;
    background: red;
}