How do you create scrollable tables in HTML? I've tried placing the TBODY section in a DIV and setting "overflow-y: scroll." This works until the user prints the page, when only the visible area of the table is printed. Is this the only way or the preferred method for creating scrollable tables? If not, what is the preferred method and if so, how can I print the entire table? I've tried using "@media print" in the style sheet to override the overflow attribute, but the attribute is not inherited from the CSS.
Also, if at all possible, I would like to keep this in a single table with fixed headers so that I may use "display:table-header-group" to print the header at the top of each subsequent page.
<TABLE border='1' cellpadding='1' cellspacing='1'>
<TH width='160' nowrap>Heading 1</th>
<TH width='160' nowrap>Heading 2</th>
<TH width='160' nowrap>Heading 3</th>
<TH width='160' nowrap>Heading 4</th>
<TH width='15' comment='this is the scrollbar spacer'> </th>
<TD colspan='5'><IFRAME name='myIFrame' id='myIFrame' src='myTable.htm' width='100%' height='123' border='0' frameborder='0' marginwidth='0' marginheight='0' ></iframe></td>