JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <thead>
        <tr>
            <th><a href="#">Monday</a></th>
            <th><a href="#">Wednesday</a></th>
            <th><a href="#">Thursday</a></th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td><a href="#">Programming II</a></td>
            <td><a href="#">Data structures and algorithms</a></td>
            <td><a href="#">[ blank ]</a></td>
        </tr>
        <tr>
            <td><a href="#">Discrete mathematics</a></td>
            <td><a href="#">[ blank ]</a></td>
            <td><a href="#">Project management</a></td>
        </tr>
        <tr>
            <td><a href="#">Project management</a></td>
            <td><a href="#">Data structures and algorithms</a></td>
            <td><a href="#">Discrete mathematics</a></td>
        </tr>
    </tbody>
</table>

CSS

table {
    border-collapse: collapse;
    width: 100%;
}

th,
td {
    border: 1px dotted red;
    height: 1rem;
    padding: .75rem;
    position: relative;
    z-index: 0;
}

a {
    background: wheat;
}

a:hover {
    text-decoration: none;
}

a::after {
    content: '';
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}

a:hover::after {
    background: pink;
}