JSFiddle - React, Tailwind, and code Playground
HTML
<div class="Table" id="planner">
<div id="room_207" class="row">
<div class="cell disabled-element" style="">207</div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
</div>
<div id="room_208" class="row">
<div class="cell disabled-element" style="">208</div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell busy" data-group_id="$1$6ARlIJCw$0.QtZXQF4DwyIyd0s4cnp/"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
</div>
<div id="room_209" class="row">
<div class="cell disabled-element" style="">209</div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell free"></div>
<div class="cell busy" data-group_id="$1$6ARlIJCw$0.QtZXQF4DwyIyd0s4cnp/"></div>
...
CSS
.Table
{
display: table;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
border-collapse:collapse;
}
.row
{
display: table-row;
}
.cell
{
display: table-cell;
border: solid 1px blue;
background:#C8CACC;
width:35px;
height:12px;
font-size:1px;
overflow:hidden;
line-height:1em;
vertical-align:middle;
}
.cell.busy
{
background:red;
}