JSFiddle - React, Tailwind, and code Playground

HTML

<div class="places">
<table>
    <tr>
        <td>K</td>
    </tr>
    <tr>
        <td>47</td>
        <td>48</td>
    </tr>
    <tr>
        <td>47</td>
        <td>48</td>
    </tr>
    <tr>
        <td>47</td>
        <td>48</td>
    </tr>
</table>

<table>
    <tr>
        <td>P</td>
    </tr>
    <tr>
        <td>25</td>
        <td>26</td>
    </tr>
    <tr>
        <td>25</td>
        <td>26</td>
    </tr>
    <tr>
        <td>25</td>
        <td>26</td>
    </tr>
</table>
<div>

CSS

.places table {
    float: left;
    margin-right: 26px;
    background: white;
    text-align: left;
    border-collapse: separate;
    border-spacing: 4px;
    font-size: 16px;
    color: #0D1873;
}

.places table tr {
}

.places table td {
    padding: 8px;
    text-align:center;
    border: 2px solid #d2cdd1;
    border-top: 0;
    background-color:#e7e7e7;
    text-align:center;
    cursor:pointer;
}