JSFiddle - React, Tailwind, and code Playground

by Netsurfer

HTML

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Diplay Table Test</title>
    <style type="text/css">
        #box_wrapper {
            display: table;
            width: 900px;
            height: 500px;
            margin: 0 auto;                
            border: solid 1px #0000FF;
            table-layout: fixed;   
            border-spacing: 20px;        
        }
        .box_row {
            display: table-row;
            height: 1px;
        }
        .expand {height: 100%;}
        .box_cell {
            display: table-cell;
            padding: 10px;
            background-color: #CCC;
            border: 1px solid red;        
        }
    </style>
</head>
<body>
    <div id="box_wrapper">
        <div class="box_row">
            <div class="box_cell">
                Lorem ipsum dolor sit amet,<br>consectetur adipiscing elit.
            </div>
        </div>
        <div class="box_row expand">
            <div class="box_cell">
                Lorem ipsum dolor sit amet, ...
            </div>
        </div>
        <div class="box_row">
            <div class="box_cell">
                Lorem ipsum dolor sit amet,<br>consectetur adipiscing elit.
            </div>
        </div>
    </div>
</body>
</html>