我在表格对齐方面遇到问题。我想要固定的表头和可滚动的表体。我使用
对齐表头和表体display:table-header-group
我在表体上使用了以下 css 属性
<tbody class="scrollablebody">
.scrollablebody
{
display: block; //if i remove then scroll bar is not coming..i need scroll bar
overflow-y: auto;
max-height: 200px;
}
但是当我在表体上使用上面的 css 时,所有对齐都会受到干扰。 请让我知道有没有办法做到这一点?提前致谢..
[jsfiddle] ( http://jsfiddle.net/saurabh07/7aj5fxmb/ )
最佳答案
只是为每个表格行添加了不同的 id。
HTML
<tr>
<td id="name">Adam</td>
<td id="lastname">Gil</td>
<td id="id">0067</td>
<td id="country">Australia</td>
<td id="branch">Sydney</td>
<td id="location">Sydney AU</td>
<td id="cardno">67543</td>
<td id="percent">50%</td>
</tr>
CSS
#name {
width: 13.2%;
}
#lastname {
width: 12.9%;
}
#id {
width: 22.8%;
}
#country {
width: 10.5%;
}
#branch {
width: 9.3%;
}
#location {
width: 10.9%;
}
#cardno {
width: 10.5%;
}
#percent {
}
关于javascript - 标题固定且主体可滚动时的表格对齐方式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25185434/