JQuery UI を使用して、サイズ変更可能で移動可能な div があります。その中に垂直にスクロールするテーブルが必要です。テーブルの高さを 100% に設定しようとしても、基本的に何も起こりません。また、上下を 0 に設定した絶対配置も機能しません。別の div をコンテナーとして配置しようとしましたが、それが何よりも近づきましたが、それでも適切に動作しません。
これがフィドルです:http://jsfiddle.net/scottbeeson/KrP7v/1/
関連する CSS は次のとおりです。
table {
border-collapse: collapse;
width: 100%; height: 100%;
}
#tableContainer {
height: 100%; width: 100%;
overflow-x: hidden;
overflow-y: scroll;
}
基本的な HTML レイアウト:
<div id="window">
<div id="header">Draggable Header</div>
<div id="tableContainer">
<table>
<thead>
<tr>
<td>Column 1</td>
<td>Column 2</td>
</tr>
</thead>
<tbody>
...
</tbody>
</table>
</div>
</div>