When I set HTML table header height 200px, it’s not repeated on every page while printing it. Same behavior is observed on Chrome and Edge.
Table header content is dynamic and some times it occupies half of the page, and requirement is to repeat it on every page while printing.
<code><html>
<body>
<table style="border: 1px solid black;">
<thead style="font-size:22px !important; vertical-align: top; text-align:left; height:200px;">
<tr>
<th style="background-color: lightyellow;">
Header Text
</th>
</tr>
</thead>
<tbody style="font-size:8px !important;">
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
</tbody>
</table>
</body>
</html>
</code>
<code><html>
<body>
<table style="border: 1px solid black;">
<thead style="font-size:22px !important; vertical-align: top; text-align:left; height:200px;">
<tr>
<th style="background-color: lightyellow;">
Header Text
</th>
</tr>
</thead>
<tbody style="font-size:8px !important;">
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
</tbody>
</table>
</body>
</html>
</code>
<html>
<body>
<table style="border: 1px solid black;">
<thead style="font-size:22px !important; vertical-align: top; text-align:left; height:200px;">
<tr>
<th style="background-color: lightyellow;">
Header Text
</th>
</tr>
</thead>
<tbody style="font-size:8px !important;">
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
<tr style="background-color: lightblue;">
<td>
Body text
</td>
</tr>
<tr>
<td>
Body text
</td>
</tr>
</tbody>
</table>
</body>
</html>
The header should be repeated on every page while printing.
New contributor
Dev Murari is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.