JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div id="div1">1</div>
    <div id="div2">2</div>
    <div id="div3">3</div>
</div>

CSS

#div1{
    height:auto;
    text-align:center;
    width:290px;
    left:0;
    float:left;
    border: 1px solid #ccc;
}

#div2{
   float:left;
    overflow: scroll;
    border: 1px solid #ccc;
    width: calc(100% - 420px - 20px - 6px - 290px);
}

#div3{
    width: 420px;
    border: 1px solid #ccc;
    right:2px;
    padding:10px;
    float:right;
}