JSFiddle - React, Tailwind, and code Playground

HTML

<div id="table">
    <div id="table-cell1">table cell 1</div>
    <div id="table-cell2">table cell 2</div>
    <div id="table-cell3">table cell 3</div>
</div>

CSS

body{margin: 0}
#table{
    display: table;
    width: 100%;
}
#table-cell1{
    display: table-cell;
    width: 80px;
    *float: left;
    background-color: yellow;
}
#table-cell2{
    /* remaning space */
    display: table-cell;
    background-color: black;
    *float: left;
    color: white;
}
#table-cell3{
    display: table-cell;
    width: 80px;
    *float: left;
    background-color: yellow;
}