私は、列の数が1から10に変わるかもしれないテーブルを持っていますが、余分なスペースがないように常に固定幅に留まるべき1つの列を除いて、またはラップしません(それはテーブルの行を追加または削除するために使用されます)。htmlテーブルのヘッダーに幅とピクセル幅を混在させることはできますか?
テーブルのサイズは、合計が800pxより大きくならないようにしてください。送信ボタンを右側に浮かべたいと思います。
パーセントで変更されているテーブルの列幅と固定ピクセル幅としての1つの静的列を設定する方法はありますか?それは問題を引き起こすか?私は数多くのアプローチを試みましたが、すべて最適ではないようです。これを行うエレガントな方法はありますか?参考のために画像を添付しました:http://bayimg.com/BAlLLaaDP
HTML:すべての行の合計幅が100%以上でない場合より多くの行またはテーブルをにスケーリングされる場合
<html>
<head>
<style>
#container {
width: 800px;
}
#table_container {
padding:5px;
}
#table_container table {
width: 85%;
}
.action {
}
col {
width:29%;
}
table {
width:650px;
table-layout: fixed;
float: left;
}
</style>
</head>
<body>
<div id="container" class="clearfix">
<form>
<table class="" border=1>
<colgroup>
<col >
<col>
<col>
<col class="action">
</colgroup>
<th>First Name</th>
<th>Last Name</th>
<th>Email </th>
<th></th>
<tr>
<td>content 1</td>
<td>content 2</td>
<td>content 3 </td>
<td><a href="">delete row</a>
</tr>
<tr>
<td>content 1</td>
<td>content 2</td>
<td>content 3 </td>
<td><a href="">delete row</a>
</tr>
</table>
<div class="mult_answer">
<button class="button orange">Submit Answer</button>
</div>
</form>
</div>
</body>
</html>
ありがとうございました。私はtd要素の幅を削除しましたが、そこには存在しないはずです。 – David