JSFiddle - React, Tailwind, and code Playground

HTML

<table id="wrap">
<tr>
    <td id="col1">col1</td>
    <td id="col2">col2</td>
    <td id="col3">col3</td>
    <td id="col4">col4</td>
</tr>
</table>

CSS

#wrap {
    min-width: 976px;
    width: 1200px; /* so there's enough room in this box */
}
#wrap tr td {
    padding: 0;
    border-spacing: 0px;
}

#col1,
#col4 {
    background: blue;
}
#col2 {
    width: 664px;
    background: green;
}
#col3 {
    width: 312px;
    background: red;
}