Scrollable Table Ideas (tricky)

I've been wrestling with this for some time now. Say that I have a table that has many rows and many columns (overflows the page vertically and horizontally). I want to fix the fir

Solution 1:

No need to split the the table into 2 tables. You can try the following which uses one table but still freezes the header.

<table ><thead><tr><th>This is my header</th></tr></thead><tbodystyle="max-height:100px;overflow:auto;display:block"><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr><tr><td>col1</td></tr></tbody></table>

Solution 2:

I use the jquery datatables plugin, an example of what you want can be seen here http://www.datatables.net/examples/basic_init/scroll_xy.html