0
我正在嘗試在可滾動的div周圍有一個固定的頁眉和頁腳。Div在動態表格加載不重新定位頁腳
如果我將表Div設置爲絕對值(儘管我獲得了滾動條),當數據加載到表格行時,頁腳不會重新定位。如果我讓它呈現默認值,那麼頁腳會正確移動到頁面的底部,但表格的div只是擴展到它需要的大小,我必須使用瀏覽器滾動。
<header/>
<div id="ListDiv">
<table id="adapter-table" class="grid">
<thead>
<tr>
<th>Manufacturer</th>
<th>Name</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody data-bind="foreach: Adapters">
<tr>
<td data-bind="text: Manufacturer"></td>
<td data-bind="text: Name"></td>
<td><a href="#" data-bind="click: $parent.selectItem">Edit</a></td>
<td><a href="#" data-bind="click: $parent.deleteItem">Delete</a></td>
</tr>
</tbody>
</table>
</div>
<footer/>
如何讓表格滾動?我不在乎thead
是否從屏幕上滾動下來,找出它並不複雜,腳下的編輯表格使它不必要。
我想這是我的CSS:
body {
height:100%;
}
header, footer {
background: #ccc;
height:20%;
}
#ListDiv{
height: 60%;
width: 100%;
overflow-y:auto;
}
.grid {
border: 1px solid black;
border-spacing: 0;
width: 95%;
}
我已經設置在http://jsfiddle.net/gregmason/UChLF/10/
這確實讓它再次滾動,謝謝你,但有沒有辦法讓它自動調整大小的不同屏幕尺寸? –
也許用javascript來計算可用空間的高度,並在文檔加載時設置身體的高度? –
Ick ...太多的JS已經使用淘汰賽了。我更喜歡根據需要調整大小的東西。 –