htmlcsshtml-tablehtml-to-pdftable-footer

Repeat HTML table-footer on every printed page


In my body i have a table element (like this below). When i want to print my html page, there should be the and content on every page. The header is working great but the footer is only showed at the last page. I have found many "solutions" for a problem like this but none worked

Adding or removing --style="display: table-footer-group"-- to the element does nothing.

It is imported to use only HTML and CSS

<table>
    <thead>
        <tr>
            <td colspan="5">
                <table style="width: 100%;">
                    <tr>                      
                        <td>Some Header Stuff</td>
                    </tr>                        
                </table>
            </td>
        </tr>
          <tr class="border_bottom">
              <td colspan="1" class="styledheader">header1</td>
              <td colspan="1" class="styledheader">header2</td>
              <td colspan="1" class="styledheader">header3</td>
              <td colspan="1" class="styledheader">header4</td>
              <td colspan="1" class="styledheader">header5</td>
          </tr>
    </thead>
       <tfoot>
            <tr class="border_top">
                <td colspan="1">Footer Left</td>
                <td colspan="4">Footer Right</td>
            </tr>
        </tfoot>
    <tbody>      
    <tr>
        <td>SomeText</td>
        <td>SomeText</td>
        <td>SomeText</td>
        <td>SomeText</td>
        <td>SomeText</td>
    </tr> 
    ---More rows
   </tbody>
</table>

--- Edit 12.05.2017 09:45 -- Changed code as creativename & daviddomain wrote

Changed

<td colspan="1" id="styledheader">header1</td>

to

<td colspan="1" class="styledheader">header1</td>

and made first "/tbody" to "tbody"


Solution

  • You're probably using chrome. According to https://crbug.com/656232 (While table header prints in all pages, table footer only appears in last page) Edge and Firefox do what you want you want, but chrome support is in progress.

    So, until chrome gets that bug fixed, use a different browser.