Ron Hinds wrote:
I have several pages with tables that have data-driven content. Sometimes
the tables can get quite large. What I want to do is have the header (with
column nmaes) remain stationary while the body is scrollable.
The basic technique is, in HTML:
<table>
<thead>
<tr><!-- header row --></tr>
<!-- perhaps more rows of headers -->
</thead>
<tfoot>
<!-- yes, TFOOT comes before TBODY -->
<tr><!-- footer row --></tr>
<!-- perhaps more rows of footers -->
</tfoot>
<tbody>
<tr><!-- data line 1 --></tr>
<tr><!-- data line 2 --></tr>
<tr><!-- data line 3 --></tr>
<!-- etc -->
</tbody>
</table>
with the following CSS:
TBODY { height: 10em; overflow: auto; }
Basic technique can be seen here:
http://examples.tobyinkster.co.uk/table-tricks/scroll
Works in very few browsers, though it degrades very well in those
browsers that doesn't support it.
--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~
http://tobyinkster.co.uk/contact