JSFiddle - React, Tailwind, and code Playground

HTML

<table class="my-info">
    <tbody>
    <tr>
        <td class="info-left">First name:</td>
        <td class="info-highlight">FirstName</td>
    </tr>
    <tr>
        <td class="info-left bottom-border">Surname:</td>
        <td class="info-highlight bottom-border">Surname</td>
    </tr>
    <tr>
        <td class="info-left">Email:</td>
        <td class="info-highlight">TheEmail</td>
    </tr>
    </tbody>
</table>

CSS

.my-info {
    border-collapse: collapse;
}
.my-info td{
    /*add some padding to space it out if you want*/
    padding: 0 3px;
}
.bottom-border { border-bottom: 1px dashed black; }