56 views
1. 問題点
<table> の中にある列 <th> <td> の幅を指定しても自動調整されてしまう。
fixed, max-with, min-width 等々を試したが、どれも不完全だ。
2. 解決策
現状、一番効果があるのは以下の colgroup で指定する方法だった。
<!DOCTYPE html>
<html>
<head>
<title>Example no.160</title>
<style>
table{ width: 100%; }
th, td{ border: 1px #000 solid; text-align: center; }
</style>
</head>
<body>
<table>
<colgroup>
<col style="width: 10%;">
<col style="width: 15%;">
<col style="width: 10%;">
<col style="width: 65%;">
</colgroup>
<thead>
<tr>
<th>10%</th>
<th colspan="2">15%+10%</th>
<th>65%</th>
</tr>
</thead>
<tbody>
<tr>
<td>10%</td>
<td>15%</td>
<td>10%</td>
<td>65%</td>
</tr>
</tbody>
</table>
</body>
</html>