JSFiddle - React, Tailwind, and code Playground
by ponyspy
HTML
<table>
<thead>
<tr class="headfoot"><td>header</td></tr>
</thead>
<tbody>
<tr>
<td class="fill">
<div id="content">
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
put lots of text here
</div>
</td>
</tr>
</tbody>
<tfoot>
<tr...
CSS
table {
width: 50%;
height: 50%;
border-spacing: 0;
position:absolute;
}
td {
border: 1px solid black;
}
#content {
position:absolute;
width:100%;
left:0px;
top:20px;
bottom:20px;
overflow: hidden;
}
body{padding:2px;}