我有一个Django网站,下面显示的CSS会修改我的表格,使其具有固定的标题和可滚动的正文。
@import 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css';
.table-fixed > tbody {
display: block;
max-height: 600px;
overflow-y: auto;
}
.table-fixed > thead {
display: table;
width: 100%;
table-layout: fixed;
}
.table-fixed > tbody > tr {
display: table;
width: 100%;
table-layout: fixed;
}
.table-fixed > thead {
width: calc(100% - 1em)
}

<div class="col-xs-12">
<table class="table table-hover table-striped table-condensed table-fixed">
<thead>
<tr>
<th>Head</th>
</tr>
</thead>
<tbody>
<tr>
<td>
1
</td>
</tr>
<tr>
<td>
2
</td>
</tr>
<tr>
<td>
3
</td>
</tr>
<tr>
<td>
4
</td>
</tr>
<tr>
<td>
5
</td>
</tr>
<tr>
<td>
6
</td>
</tr>
<tr>
<td>
7
</td>
</tr>
<tr>
<td>
8
</td>
</tr>
<tr>
<td>
9
</td>
</tr>
<tr>
<td>
10
</td>
</tr>
</tbody>
</table>
</div>
&#13;
这些表可以正常工作并完成他们的工作。当我在Chrome上并使窗口全屏显示时会出现此问题。滚动条消失了。
另一方面,如果我在IE中这样做没有任何改变。我可以将窗口全屏显示,表格仍然有滚动。
在Chrome中导致此问题的任何想法?