上下两表格各列对其问题
由于下边表格出现滚动条,导致上下各列不能对其了。怎么让这个两个表格各列对其?
- PHP code
<div height="23px" style="overflow: hidden;"><table border="1px" cellpadding="0" cellspacing="0" width="98.5%"><tbody> <tr class="tr" align="center" cols="5"> <td width="20%">姓名</td> <td width="20%">性别</td> <td width="20%">民族</td> <td width="20%">号码</td> <td width="20%">操作</td> </tr></tbody></table></div><div style="overflow: auto;height:230px;" ><table border="1px" cellpadding="0" cellspacing="0" width="100%"><tbody> <?php $sql="select * from `test`"; $sqln=mysql_query($sql); while($row = mysql_fetch_array($sqln)){ ?> <tr class="tr1" align="center" cols="5"> <td width="20%"><?php echo $row[name];?></td> <td width="20%"><?php echo $row[sex];?></td> <td width="20%"><?php echo $row[nation];?></td> <td width="20%"><?php echo $row[number];?></td> <td width="20%">操作</td> </tr> <?php } ?></tbody></table></div>
[解决办法]
你这个好像是设置td的宽度等于滚动条宽度.
用下面的代码试试, 可能不用用于所有浏览器, 兼容性问题.
<script type="text/javascript">
window.onload=risehead;
window.onresize=risehead;
function risehead(){
var th=document.getElementsByTagName("table")[0];
var tc=document.getElementsByTagName("table")[1];
th.width=tc.clientWidth;
}
</script>