0

my problems are first when i tried using this what i wanted to do is to print all my pages with header and footer.. sample if i have 5pages that needed to be printed header and footer will be displayed in all pages.. so when i tried using this approach what happens is only the header is being displayed in all pages and footer is only displayed in last page.. which is not what i really wanted...

@media print {
    thead { display: table-header-group; }
    tbody { display: table-row-group; }
    tfoot { display: table-footer-group; }
    }
@media screen {
    thead { display: none; }
    tfoot { display: none; }
}

<table>
    <thead>
        <tr>
            <td>    
               <!----HEADER CONTENT----->
            </td>
        </tr>
    </head>
    <tfoot>
        <tr>
            <td>
                <!----FOOTER CONTENT----->
            </td>
        </tr>
    </tfoot>
    <tbody>
        <tr>
            <td>
                <!----FOOTER CONTENT----->
            </td>
        </tr>
    </tbody>
</table>    

next problem was when i tried opening my page on a tablet and making test print what happen is header is only displayed on the 1st page and footer displayed on the last page.. which is different when i access my page on a pc... any idea on how to fix this?.. im currently using google chrome version: 58.0.3029.110 (64-bit)..

when i tried using IE and mozilla firefox the header doesn't show up in all pages only on the first page but the footer displayed in all pages.. unlike when i open chrome header is being displayed in all pages but footer only displayed on the last page.. also when i tried accessing it on a tablet nothing seems to work.. like header is displayed on the first page and footer is displayed on the last page saying i have 5pages. is there any possible way to solve this?. cuz i think this have been an issue since 2010..

Lion Smith
  • 647
  • 3
  • 16
  • 48
  • Possible duplicate of [How to use HTML to print header and footer on every printed page of a document?](https://stackoverflow.com/questions/1360869/how-to-use-html-to-print-header-and-footer-on-every-printed-page-of-a-document) – LWilson May 26 '17 at 04:48
  • i already check that ... and tried it also but when i tried using `position:fixed` it only overlaps the header and footer specially if i have multiple pages. – Lion Smith May 26 '17 at 04:51
  • Ok. As a side note, although this is unlikely that cause of your issue, it's generally recommended that tables are not used for layout. Ideally they are reserved for structured data. – LWilson May 26 '17 at 06:00
  • I still think this question should be closed because the topic has been covered thoroughly in that other post. And I don't believe anything has changed in the years since that discussion i.e. "HTML5 and CSS3 have no support for printing page header and footers in print media" – LWilson May 26 '17 at 06:26

0 Answers0