JSFiddle - React, Tailwind, and code Playground

HTML

<table>
<tr><td><a href="#">Types</a></td><td><a href="#">Registration</a></td><td><a href="#">Airports</a></td></tr>
<tr><td><a href="#">Top</a></td><td><a href="#">Up</a></td><td><a href="#">Down</a></td><td><a href="#">Bottom</a></td></tr>
<tr><td><input type="text"></td><td><input type="Button" value="Ok"></td></tr>
</table>

CSS

table  {
 width:90%;
 border:1px solid #000;
 border-collapse:collapse;
}

td {
 float:left;
 -border:1px solid #000;
 box-sizing:border-box;
}

tr:nth-child(1) td {
 width:33.3%;
}
tr:nth-child(2) td {
 width:25%;
}
tr:nth-child(3) td:nth-child(1) {
 width:93%;
}
tr:nth-child(3) td:nth-child(2) {
 width:7%;
}

input[type="text"] {
 width:99%;  
 border:1px solid #000;
 box-sizing:border-box;
 margin:2px;
 padding:3px;
}

input[type="button"] { 
 width:100%;
 border:1px solid #000;
 margin:2px 2px 2px -2px;
 padding:2px;
}

tr:nth-child(1) a {
 font-weight:bold;
}

a {
 display:block;
 margin:2px;
 padding:3px;
 text-decoration:none;
 text-align:center;
 color:#000;
 border:1px solid #000;
 background:#eee;
}

a:hover , input[type="button"]:hover {
 background:#ede;
}