Flexible HTML Table with Fixed Header and Footer around a Scrollable Body

I’ve updated the example to not stretch the rows (although I preferred the stretchy rows).

As I said that would require js listening to the resize event. I’ve put together an example here:

These are all proof of concepts and you would need to test carefully and generally for modern browsers only. At present the JS is relying on ids so if you wanted this approach for multiple tables the js would need to be refactored to take that into account (possible a job for the JS forum as my js is basic at best).