How to let header pane only appear on first print page?

[pstein]

I have a webpage which contain the following element:

<heaeder class="site-header">
....
</header>

With CSS class definition as follows:
                            
.site-header {
    position: relative;
    z-index: 223;
    ....
    box-shadow: none;
}

 

When I print now this (long) web page into a pdf doc file then this header pane appears at the top of each pdf page.

How can achieve that this header pane appears only at the FIRST pdf page?

Thank you

Peter

Edited August 12, 2019 by pstein

[dsonesuk]

Is it when you print individual pages OR many pages of single specific page?

You can create print media query as shown here

https://www.w3schools.com/cssref/css3_pr_mediaquery.asp

You can then use a class name to identify which headers to print or not to print.

Edited August 12, 2019 by dsonesuk

[pstein]

I want to print a whole webpage which (when printed) creates ONE pdf file with many pdf pages.

Example

1. https://blogs.systweak.com/uninstall-unwanted-programs-on-windows-10/

Print with Chrome or from chrome-based browsers

 

[dsonesuk]

It happens when element use position: fixed, by adding this to your style.css at bottom of page this should override fixed positioning.

 

@media print {
body .header-top {

     position: static;

}
}

You may need to adjust the padding/margin styling of elements below it as a gap appears.

Edited August 13, 2019 by dsonesuk