JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.kryogenix.org/code/browser/sorttable/sorttable.js"></script>
<table id="scheduletable" class="sortable">
    <thead>
        <tr valign="top">
            <th scope="col">Course ID</th>
            <th scope="col">Course name</th>
            <th scope="col">Credits</th>
            <th scope="col">Type</th>
            <th scope="col">Start Date</th>
            <th scope="col">End date</th>
            <th scope="col">Days</th>
            <th scope="col">Start time</th>
            <th scope="col">End time</th>
            <th scope="col">Instructor</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td> <a href="/courses/?id=ABED003 11">ABED003 11</a></td>
            <td class="name" style="width: 1.5">Basic Education</td>
            <td class="small">6</td>
            <td></td>
            <td>08/18</td>
            <td>10/10</td>
            <td>MTWTHF</td>
            <td>08:30</td>
            <td>10:50</td>
            <td>Melissa Escamilla</td>
        </tr>
        <tr>
            <td> <a href="/courses/?id=ABED003 11">BBED003 11</a>

            </td>
            <td class="name" style="width: 1.5">Pet Grooming</td>
            <td class="small">7</td>
            <td></td>
            <td>10/18</td>
            <td>10/10</td>
            <td>MTWTHF</td>
            <td>08:30</td>
            <td>10:50</td>
            <td>Melissa Escamilla</td>
        </tr>
        <tr>
            <td> <a href="/courses/?id=ABED003 11">CBED003 11</a>
            </td>
            <td class="name" style="width: 1.5">Feather Plucking</td>
            <td class="small">5</td>
            <td></td>
            <td>08/18</td>
            <td>10/10</td>
            <td>MTWTHF</td>
            <td>08:30</td>
            <td>10:50</td>
            <td>Melissa Escamilla</td>
        </tr>
        <tr>
            <td> <a href="/courses/?id=ABED003 11">FBED003 11</a>
            </td>
            <td class="name">Advanced...

CSS

#scheduletable {
    width: 450px;
    font-size: 10px;
}
#scheduletable th {
    background: #E0E0E0;
}
#scheduletable tr {
    background: #FFCCCC;
}
#scheduletable th:first-child {
    background: #FFFCCC;
}
#scheduletable td {
    text-align: center;
}
#scheduletable .name {
    text-align: left;
}