JSFiddle - React, Tailwind, and code Playground

HTML

<html xmlns="https://www.w3.org/1999/xhtml">
<body>
<div class="first">
<ul class="nav">
  <li><a href="#home">流程編號</a></li>
  <li><a href="#about">流程編號</a></li>
  <li><a href="#clients">流程編號</a></li>  
  <li><a href="#contact">流程編號</a></li>
</ul>
</div>
<div class="second">
<table>
<thead>
　<tr>
　<th>流程編號</th>
  <th>姓名</th>
  <th>位</th>
  <th>號</th>
  <th>見</th>
  <th>審查</th>
  <th>目前簽核處</th>
  <th>送達時間</th>
 　</tr>
  </thead>
　　<tr>
　<td>流程編號</td>
  <td>姓名</td>
  <td>位</td>
  <td>號</td>
  <td>見</td>
  <td>審查</td>
  <td>目前簽核處</td>
  <td>送達時間</td>
 　</tr>
　　<tr>
　<td>流程編號</td>
  <td>姓名</td>
  <td>位</td>
  <td>號</td>
  <td>見</td>
  <td>審查</td>
  <td>目前簽核處</td>
  <td>送達時間</td>
 　</tr>
　　<tr>
　<td>流程編號</td>
  <td>姓名</td>
  <td>位</td>
  <td>號</td>
  <td>見</td>
  <td>審查</td>
  <td>目前簽核處</td>
  <td>送達時間</td>
 　</tr>
</table>
</div>
</body>
</html>

CSS

html,body{
height:100%;
}
.first{
background-color:#FFBB66;
width:15%!important;
height:100%;
margin-bottom:0% !important;
float:left;
display:inline-block;
}
.second{
 display: inline-block;
 border: 1px solid black;
 width:70%!important;
 margin:0;
}

.nav {
  list-style-type: none;
  text-align: center;
  margin: 0;
  padding: 0;
}
.nav li {
  font-size: 20px;
}
table, th, td {
  border: 1px solid black;
}