Fixed Header on every printed page and avoid page break inside in Footer

Question

There are three Div's in my page, with the class of invoiceHeader, invoiceBody, and invoiceFooter. I want to repeat the first div (.invoiceHeader) on every printed page, and I want to avoid page break inside on the thired Div (.invoiceFooter)while printing, ther will be no footer on the page. How can I do this?

Answer 1

Following code can help you as a sticky page header and footer for printing

@media print { 
    .centerDiv{
        width: 80%;
        margin: 0 auto; /* Center the DIV horizontally */
    }
    .fixed-header, .fixed-footer{
        width: 100%;
        position: fixed;    
    }
    .fixed-header{
        top: 0;
    }
    .fixed-footer{
        bottom: 0;
    } 

}