JSFiddle - React, Tailwind, and code Playground

by NerfAnarchist

HTML

<table>
  <thead>
    <tr>
      <th rowspan="2">Schema</th>
      <th rowspan="2">Name</th>
      <th colspan="2">Implied</th>
      <th colspan="2">Explicit</th>
      <th rowspan="2">Columns</th>
      <th rowspan="2">Rows</th>
      <th rowspan="2">Comments</th>
    </tr>
    <tr>
      <th>Children</th>
      <th>Parents</th>
      <th>Children</th>
      <th>Parents</th>
    </tr>
    
  </thead>
  <tbody>
    <tr>
       <td>adf</td>
       <td>fdas_asdf</td>
       <td class="center">2</td>
       <td class="center">1</td>
       <td class="center">4</td>
       <td class="center">3</td>
       <td class="center">10</td>
       <td class="center">158</td>
       <td>Fake Table</td>
    </tr>
    <tr>
       <td>adf</td>
       <td>fdas_qwer</td>
       <td class="center">1</td>
       <td class="center">0</td>
       <td class="center">2</td>
       <td class="center">2</td>
       <td class="center">8</td>
       <td class="center">1008</td>
       <td>Fake Table</td>
    </tr>
    <tr>
       <td>adf</td>
       <td>fdas_qwer</td>
       <td class="center">1</td>
       <td class="center">0</td>
       <td class="center">2</td>
       <td class="center">2</td>
       <td class="center">8</td>
       <td class="center">1008</td>
       <td>Fake Table</td>
    </tr>
    <tr>
       <td>adf</td>
       <td>fdas_qwer</td>
       <td class="center">1</td>
       <td class="center">0</td>
       <td class="center">2</td>
       <td class="center">2</td>
       <td class="center">8</td>
       <td class="center">1008</td>
       <td>Fake Table</td>
    </tr>
    <tr>
       <td>adf</td>
       <td>fdas_qwer</td>
       <td class="center">1</td>
       <td class="center">0</td>
       <td class="center">2</td>
       <td class="center">2</td>
       <td class="center">8</td>
       <td class="center">1008</td>
       <td>Fake Table</td>
    </tr>
    <tr>
       <td>adf</td>
       <td>fdas_qwer</td>
       <td class="center">1</td>
       <td...

CSS

table {
  font-size: 10px;
  font-family: verdana;
  width: 100%;
  border-collapse: collapse;
  border-bottom: 1px solid #AAA;
  border-right: 1px solid #AAA;
}

thead {
  background-color: #C6DEFF;
  font-size: 9px;
}
table td,
table th {
  border-top: 1px solid #AAA;
  border-left: 1px solid #AAA;
}

table .center {
  text-align: center;
}
table tbody tr:nth-child(even) {
  background-color: #DFEBFB;
}