Disabling browser printing headers and footers while keeping margins, but also on page 2, 3, etc

Question

@media print { 
    @page { margin: 0; }
    body { margin: 15mm 15mm 15mm 15mm; /* margin for the content */ }
}

to disable the browser's priting header/footer, it actually works on the first page of the document, but not on page 2, page 3, etc. which have a zero-margin (this is normal, because of margin: 0).

Of course we could change the margin-top for other pages, but then it would restore the browser printing header.

How to remove the browser's printing header/footer from CSS or JS, but have a 15mm plain white margin on all pages of the printed document?

score 0 · Answer 1 · answered Sep 26 '17 at 08:11

0

 <style type="text/css" media="print">
  @page {
    size: auto;  
    margin: 0;  
  }
 </style>

answered Sep 26 '17 at 08:11

Prakash R

47
3

This doesn't give a 15 mm white margin to all pages of the document. – Basj Sep 26 '17 at 08:14

score -2 · Answer 2 · answered Sep 26 '17 at 07:25

-2

On your css :

div.hidden {
   visibility: hidden
}

HTML :

<div class="hidden">This is an header/footer</div>

answered Sep 26 '17 at 07:25

Prakash R

47
3

I'm not speaking about this header/footer, but [the header/footer automatically added by the browser](http://3.bp.blogspot.com/-BtJwpiC0j3w/VUbrZrDyaQI/AAAAAAAAFrg/yyr0ACceY7c/s1600/header-footer-on-browser-printing.png) when printing. – Basj Sep 26 '17 at 07:39

Disabling browser printing headers and footers while keeping margins, but also on page 2, 3, etc

2 Answers2