テーブルの基本コードをよく忘れるので残します。
See the Pen
yLaYmrv by keikoro (@momoi)
on CodePen.
<table>
<tr>
<th></th>
<th>head</th>
<th>head</th>
<th>head</th>
</tr>
<tr>
<th>head</th>
<td>col</td>
<td>col</td>
<td>col</td>
</tr>
<tr>
<th>head</th>
<td>col</td>
<td>col</td>
<td>col</td>
</tr>
</table>
table{
border-collapse: collapse;
border-spacing: 0;
/* 列幅を均等にしたい場合は指定する */
table-layout: fixed;
width: 600px;
}
table,
th,
td {
background: #fff;
border: 1px solid #707070;
vertical-align: middle;
padding: 10px;
}
th:first-child {
width: 100px;
}
大事な部分はこのあたり。
隣接セルのボーダーを重ねて表示
border-collapse: collapse;
列幅を均等にする
table-layout: fixed;
width: 600px;