Table styles

[mhulse]

.table {
    empty-cells: hide;
    margin: 20px 0;
    width: 100%;
    border-collapse: collapse;
}
.table caption { text-align: left; }
.table thead { vertical-align: bottom; }
.table tfoot { vertical-align: top; }
.table tfoot th,
.table tfoot td { color: #666; }
.table th,
.table td {
    text-align: left;
    padding-right: 5px;
    padding-left: 5px;
}
.table th:first-child,
.table td:first-child { padding-left: 0; }
.table th:last-child,
.table td:last-child { padding-right: 0; }
.table th { white-space: nowrap; }
.table tbody { vertical-align: top; }
.table.table-border-x thead th,
.table.table-border-x tbody th,
.table.table-border-x tbody td { border-bottom: 1px solid #999; }
.table.table-border-x tfoot th,
.table.table-border-x tfoot td { border-top: 1px solid #999; }
.table.table-border-x tbody tr:last-child th,
.table.table-border-x tbody tr:last-child td { border-bottom: 0; }
.table.table-border-y th,
.table.table-border-y td {
    border-right: 1px solid #999;
    border-left: 1px solid #999;
}
.table.table-border-y th:first-child,
.table.table-border-y td:first-child { border-left: 0; }
.table.table-border-y th:last-child,
.table.table-border-y td:last-child { border-right: 0; }

<table class="table table-border-x table-border-y">
    <caption>Li Europan lingues es membres del sam familie.</caption>
    <thead>
        <tr>
            <th scope="col">Europan</th>
            <th scope="col">Omnicos</th>
            <th scope="col">Occidental</th>
            <th scope="col">Cambridge</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <td colspan="4">Lor separat existentie es un myth.</td>
        </tr>
    </tfoot>
    <tbody>
        <tr>
            <th scope="row">Pronunciation e plu</th>
            <td>On refusa continuar payar</td>
            <td>Occidental in fact</td>
            <td>On refusa continuar payar</td>
        </tr>
        <tr>
            <th scope="row">Grammatica</th>
            <td>It va esser tam simplic</td>
            <td></td>
            <td>Lor separat existentie</td>
        </tr>
        <tr>
            <th scope="row">Simplic e regulari</th>
            <td>Omnicos directe al desirabilite</td>
            <td></td>
            <td>Custosi traductores</td>
        </tr>
        <tr>
            <th scope="row">Lor separat existentie</th>
            <td></td>
            <td></td>
            <td>Ma quande lingues coalesce</td>
        </tr>
    </tbody>
</table>

[mhulse]

No class:

table {
    margin: 2rem 0;
    width: 100%;
    display: inline-table;
    border-collapse: collapse;
    empty-cells: hide;
}
table caption { text-align: left; }
table thead { vertical-align: bottom; }
table tfoot { vertical-align: top; }
table tfoot th,
table tfoot td { color: #666; }
table th,
table td {
    text-align: left;
    padding-right: .5rem;
    padding-left: .5rem;
}
table th:first-child,
table td:first-child { padding-left: 0; }
table th:last-child,
table td:last-child { padding-right: 0; }
table th { white-space: nowrap; }
table tbody { vertical-align: top; }
table thead th,
table tbody th,
table tbody td { border-bottom: 1px solid #000; }
table tfoot th,
table tfoot td { border-top: 1px solid #000; }
table tbody tr:last-child th,
table tbody tr:last-child td { border-bottom: 0; }
table th,
table td {
    border-right: 1px solid #000;
    border-left: 1px solid #000;
}
table th:first-child,
table td:first-child { border-left: 0; }
table th:last-child,
table td:last-child { border-right: 0; }