I have the following which is a mostly css scrollable table. Works great in Chrome and Firefox, but it will not set the height of the tbody element in IE 9. any thoughts?
function scrollify(table,height){
table.find('thead').addClass('fixed_header');
table.find('tbody').addClass('scroll_content').height(height);
$('<div/>').addClass('table_wrap').appendTo(table.parent()).append(table);
}
css
.fixed_header th,tbody.scroll_content td{
display:block;
float:left;
width:3em;/*this is dynamically set in full function*/
}
.table_wrap{
float:left;
}
.fixed_header tr{
position:relative;
}
.scroll_content{
display:block;
overflow-y:scroll;
overflow-x:show;
}
It appears that it is simply an issue with IE not respecting tbody (or table for that matter)
heightcss property. I could not for the life of me style the height for table or tbody elements in IE. You can see in this answer, that the last comment mentions it does not work for IE.