有一个有 5 列的表。列可能有不同的宽度(我没有分配恒定的宽度)。
现在我想在表格顶部创建 5 个输入元素。是否有任何技巧可以使每个输入元素的宽度等于相应的列宽?
例如,输入 1 应具有第 1 列的宽度,输入 2 - 应具有第 2 列的宽度,等等。
那么,如何将输入绑定到列?
更新:
<script>
$('#addButton').click(function() {
$("#addContent").slideToggle("slow");
$('input').width(+$('table td').width()-1);
});
</script>
<div id = "add">
<div id = "addButton" title='New Record' ;>
<img src='images/add.png' alt='New Record' />
</div>
<div id = "addContent">
<input type="text">
<input type="text">
</div>
</div>
<table id="newspaper-b" border="0" cellspacing="2" cellpadding="2" width = "100%">
<thead>
<tr>
<th scope="col">Opr</th>
<th scope="col">Flt Num</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<?php foreach ($result1 as $row):
$status=$row['status'];
$airlineName=$row['airlineName'];
$flightNum=$row['flightNum'];
?>
<tr id="<?php echo $flightNum; ?>" class="edit_tr">
<td width="80" ><?php echo $airlineName;?></td>
<td width="80" ><?php echo $flightNum;?></td>
<td width="80" id="<?php echo $flightNum; ?>" class="deact_but">
<div>
<img src='images/delete.png' alt='Deactivate' />
</div>
</td>
</tr>
<?php endforeach;?>
</tbody>
</table>
CSS
input{
float: left;
margin: 0;
padding: 0;
}