Repeating header & footer layout

repeating-header-and-footer-layout.html

<style>
    body {
        margin: 0;
    }
    .header,
    .header-space,
    .footer,
    .footer-space {
        height: 160px;
    }
    .header {
        position: fixed;
        top: 0;
    }
    .footer {
        position: fixed;
        bottom: 0;
    }
</style>

<table>
    <thead>
        <tr>
            <td>
                <div class="header-space">&nbsp;</div>
            </td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>
                <div class="content">Lorem, ipsum dolor.</div>
            </td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td>
                <div class="footer-space">&nbsp;</div>
            </td>
        </tr>
    </tfoot>
</table>

<div class="header">This is repeating header.</div>
<div class="footer">This is repeating footer.</div>