JSFiddle - React, Tailwind, and code Playground

infoTable - No Header for cR-v2

by Jennifer Perrin

HTML

<table class="infoTable">
    <tbody>
        <tr>
            <td class="infoKey">Email</td>
            <td class="infoVal">[email protected]</td>
        </tr>
        <tr>
            <td class="infoKey">Phone</td>
            <td class="infoVal">(555) 555-7777</td>
        </tr>
        <tr>
            <td class="infoKey">Cell Phone</td>
            <td class="infoVal">(555) 555-7878</td>
        </tr>
    </tbody>
</table>

CSS

@import url(http://fonts.googleapis.com/css?family=Droid+Sans);
body { font-family: 'Droid Sans'; }

table.infoTable {
    border-collapse: collapse;
    border-spacing: 0;
}
.infoTable tr {
    border-bottom: 2px solid #fff;
}
.infoTable td {
    padding: 2px 0 2px 10px;
    font-size: 13px;
    border-right: 2px solid #fff;
    border-top: 2px solid #fff;
    background: #f0f0f0;
}
.infoTable td:first-of-type {
    border-left: 2px solid #fff;
}
.infoTable td a {
    font-weight: normal;
}

.infoTable {
    width: 100%;
    display: table;
}
.infoKey {
    text-align: left;
    font-weight: bold;
    width: 25%;
}
.infoVal {
    text-align: left;
}