Overflow CSS property on tbody for IE (IE 11)

I have a table with a thead and a tbody with the tbody’s overflow-y set to auto and height set to 800px.

This works as expected in Chrome and every other browser except IE which decides that each td in the tbody needs to have a height of 800px.

How can I have my tbody at a height I want and have the tds inside remain normal on IE?



I assume you are setting tbody to display:block to make this work in Firefox and Chrome or have you found a new method?

The problem with setting tbody to display:block is that you lose the relationship between the data in the header and the data in the body unless you fix all the widths.

As far as I know having a scrollable tbody is not possible by simply addressing the tbody and without changing it to display:block. There seems to be no fix for IE either to make this compatible.

There are other CSS methods of having a fixed header and scrolling body but most have drawbacks which is why JS methods are still used for full cross browser support.