JSFiddle - React, Tailwind, and code Playground

by Stjepan Brbot

HTML

<table>
<thead>
  <tr><th>thead</th><th>thead</th></tr>
  <tr><th>thead</th><th>thead</th></tr>
</thead>
<tbody>
  <tr><td>tbody</td><td>tbody</td></tr>
  <tr><td>tbody</td><td>tbody</td></tr>
  <tr><td>tbody</td><td>tbody</td></tr>
</tbody>
<tfoot>
  <tr><td>tfoot</td><td>tfoot</td></tr>
  <tr><td>tfoot</td><td>tfoot</td></tr>
</tfoot>
</table>

CSS

table
{
  color: #fff;
  font-size: 9pt;
  border-width: 1px;
  border-color: #999;
  border-spacing: 1px;
  border-collapse: separate;
  border-radius: 4px;
  background-color: #444;
  box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
  margin-top: 10px;
  margin-bottom: 20px;
  margin-left: auto;
  margin-right: auto;
  padding: 4px;
}
td,th
{
  padding: 4px;
}
thead tr th
{
  background-color: #66f; 
}
table *:last-child tr:last-child
{
  color: #333;
  background-color: #ff8;
}