Css 列标题固定后，表的第一行将消失（粘性标题）
我需要你的帮助 我似乎不明白为什么表中的第一行（ABC-123-123456）会消失，或者在顶部列修复后会隐藏。由于我的工作使用IE7，我仍然需要能够有一个浏览器兼容的粘性列标题Css 列标题固定后，表的第一行将消失（粘性标题）,css,html-table,sticky,Css,Html Table,Sticky,我需要你的帮助 我似乎不明白为什么表中的第一行（ABC-123-123456）会消失，或者在顶部列修复后会隐藏。由于我的工作使用IE7，我仍然需要能够有一个浏览器兼容的粘性列标题 <!DOCTYPE html> <html> <head> <style type="text/css"> #data_container { margin-top: 5px; width: 100%; height: 200px;
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#data_container {
margin-top: 5px;
width: 100%;
height: 200px;
overflow-x: scroll;
overflow-y: scroll;
border: 1px solid #ccc;
position: relative;
color: rgb(60,60,60);
font-size: 9pt;
}
#data {
border-collapse:collapse;
border-spacing: 0;
border-right: 1px solid #ccc;
table-layout: fixed;
}
#data th {
border-bottom:1px solid #ccc;
border-left: 1px solid #ccc;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#dcdcdc");
font-weight: normal;
}
#data tr {
text-align: center;
}
#data td {
border-bottom:1px solid #ccc;
border-left: 1px solid #ccc;
text-align: left;
padding-left: 6px;
}
#data tr:hover td { background: #f2f2f2; }
#data th, #data td {
height: 20px;
width: 130px;
}
#data tr td:first-child, #data tr th:first-child {
border-left: 0;
}
#data thead tr {
top:expression(this.offsetParent.scrollTop);
position: absolute;
}
#data tr:first-child td {
border-top: 0;
}
</style>
</head>
<body>
<div id="data_container">
<table id="data">
<!-- Table Header -->
<thead>
<tr>
<th data-sort="string">File Number</th>
<th>Test Column</th>
<th>Request Type</th>
<th>Resize This</th>
<th>Firstname</th>
<th>Lastname</th>
<th data-sort="string">Progress</th>
<th>Vital Task</th>
</tr>
</thead>
<!-- Table Header -->
<!-- Table Body -->
<tbody>
<tr>
<td>ABC-123-123456</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>100%</td>
<td>Yes</td>
</tr><!-- Table Row -->
<tr>
<td>ABC-123-942471</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>100%</td>
<td>Yes</td>
</tr><!-- Darker Table Row -->
<tr>
<td>ABC-123-408126</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>20%</td>
<td>No</td>
</tr>
<tr>
<td>ABC-123-396225</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>80%</td>
<td>No</td>
</tr>
<tr>
<td>ABC-123-385417</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>ABC-123-374250</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>ABC-123-408970</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>ABC-123-404552</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>ABC-123-403102</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>100%</td>
<td>Yes</td>
</tr>
<tr>
<td>ABC-123-404555</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>23%</td>
<td>yes</td>
</tr>
<tr>
<td>ABC-123-406789</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>80%</td>
<td>No</td>
</tr>
<tr>
<td><a href="#yep-iit-doesnt-exist">Hyperlink Example</a></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>80%</td>
<td><a href="#inexistent-id">Another</a></td>
</tr>
</tbody>
<!-- Table Body -->
</table>
</body>
</html>
#数据容器{
边缘顶部：5px；
宽度：100%；
高度：200px；
溢出-x：滚动；
溢出y：滚动；
边框：1px实心#ccc；
位置：相对位置；
颜色：rgb（60,60,60）；
字号：9pt；
}
#资料{
边界塌陷：塌陷；
边界间距：0；
右边框：1px实心#ccc；
表布局：固定；
}
#数据th{
边框底部：1px实心#ccc；
左边框：1px实心#ccc；
过滤器：progid:DXImageTransform.Microsoft.gradient（startColorstr=“#ffffff”，endColorstr=“#dcdc”）；
字体大小：正常；
}
#数据传输{
文本对齐：居中；
}
#数据传输{
边框底部：1px实心#ccc；
左边框：1px实心#ccc；
文本对齐：左对齐；
左侧填充：6px；
}
#数据tr:hover td{background:#f2f2；}
#数据th，#数据td{
高度：20px；
宽度：130px；
}
#数据tr td:第一个孩子，#数据tr th:第一个孩子{
左边框：0；
}
#数据格式{
top：表达式（this.offsetParent.scrollTop）；
位置：绝对位置；
}
#数据tr：第一个孩子td{
边界顶部：0；
}
文件号
试验柱
请求类型
调整此大小
名字
姓氏
进展
要务
ABC-123-123456
100%
对
ABC-123-942471
100%
对
ABC-123-408126
20%
不
ABC-123-396225
80%
不
ABC-123-385417
ABC-123-374250
ABC-123-408970
ABC-123-404552
ABC-123-403102
100%
对
ABC-123-404555
23%
对
ABC-123-406789
80%
不
80%
#数据和tr位置：绝对
加上这个
#data tbody{
position: absolute;
top: 24px;
}
请添加一个提琴和html代码