Removing page title and date when printing web page with CSS

Question

By default   when you print a web page  the page title and and URL are printed at the top of the page  and likewise the date and time are printed at the bottom   It is possible to remove this additional as you are printing through the PAGE SETUP menu  under FILE in Internet Exp   Does anyone know of a way of doing this via CSS or javascript

User · Answer

You can add this in your stylesheet   page size auto  margin 5mm   But this discards the page number too

User · Answer

Historically  it s been impossible to make these things disappear as they are user settings and not considered part of the page you have control over   However  as of 2017  the  page at-rule has been standardized  which can be used to hide the page title and date in modern browsers    page   size  auto   margin  0mm         Print headers footers and print margins      When printing Web documents  margins are set in the browser s Page Setup  or Print Setup  dialog box  These margin settings  although set within the browser  are controlled at the operating system printer driver level and are not controllable at the HTML CSS DOM level   For CSS-controlled printed page headers and footers see Printing Headers         The settings must be big enough to encompass the printer s physical non-printing areas  Further  they must be big enough to encompass the header and footer that the browser is usually configured to print  typically the page title  page number  URL and date   Note that these headers and footers  although specified by the browser and usually configurable through user preferences  are not part of the Web page itself and therefore are not controllable by CSS  In CSS terms  they fall outside the Page Box CSS2 1 Section 13 2        i e  setting a margin of 0 hides the page title because the title is printed in the margin   Credit to Vigneswaran S for this tip

User · Answer

Try this   media print   page   margin-top  30px  margin-bottom  30px

User · Answer

There s a facility to have a separate style sheet for print  using    lt link type  text css  rel  stylesheet  media  print  href  print css  gt    I don t know if it does what you want though

User · Answer

Its simple  Just use css         lt style gt   page   size  auto   margin  0mm     lt  style gt

User · Answer

completing Kai Noack s answer  I would do this   var originalTitle   document title  document title    Print page title   window print    document title   originalTitle    this way once you print page  This will return to have its original title

User · Answer

A possible workaround for the page title     Provide a print button   catch the onclick event   use javascript to change the page title   then execute the print command via javascript as well    document title    Print page title   window print     This should work in every browser

[javascript] Removing page title and date when printing web page (with CSS?)

Examples related to javascript

Examples related to html

Examples related to css