Pure CSS Scrollable Table with Fixed Header
Using CSS to allow scrolling within a single HTML table
The Big 4 Version
Basic CSS Browser Filtering
Browser Support (table is scrollable with fixed headers)
- Opera 7.x + (All Platforms) :: Tested with 7.2x and 7.5x
- Mozilla 1.x + (All Platforms) :: Tested with 1.0x and 1.6x
- Firefox 1.0 + (All Platforms) :: Tested with 2.0x and 3.0x
- IE 6.x + (Windows) :: Tested with 6.0x, 7.0x
- Safari 1.x + (MacOS) :: Tested with 1.2x, 3.1x
- Konqueror 3.x + (Linux / BSD) :: Tested with 3.2x
Almost works (table is scrollable)
- IE 5.x + (Windows) :: Tested with 5.0x and 5.5x
Doesn't work (table is not viewable)
- Opera 5.x and 6.x :: Tested with 5.1x and 6.x
- IE 5.x + (MacOS) :: Tested with 5.2x
Degrades gracefully
- All other non-supporting browsers
Notes:
- Opera v5 to v7 adds margins to the THEAD and TBODY and their children
- On Konqueror 3.x the scrollbar may be slightly off.
Updates:
- 2004.10.15 11am: Fixed incorrect comments on Opera filtering
- 2004.10.15 11am: Added link to Bullet Resistant Version
- 2004.11.02 01pm: Fixed incorrect width on 2nd Cell. Was 250px, should be 240px.
- 2004.11.02 01pm: Updated Browser support list.
put a bunch of breaks to test scrolling within the HTML document itself.
put a bunch of breaks to test scrolling within the HTML document itself.
put a bunch of breaks to test scrolling within the HTML document itself.
done.