Problem

Question

5

Removing elements that appear when printing, using print.css stylesheet

rated 0 times [ 9] [ 4] / answers: 1 / hits: 24131 / 9 Years ago, mon, may 4, 2015, 12:00:00

Problem

I'm currently using a stylesheet print.css to remove elements and some styling to create a printer-friendly page, but I can't seem to remove four things that appear in the corners of the page, but are not in the HTML: pagination, date printed, title of page, URL of page

Possible solution?

I've seen this example from the LA Times that shows elements that are not in the HTML, but typically appear when printed being removed: http://graphics.latimes.com/oscar-bingo-2015/

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

makenatiffanic

Add To Favorites

Follow

Total Points: 412

Total Questions: 106

Total Answers: 90

Location: Marshall Islands

Member since Tue, Sep 21, 2021

3 Years ago

answered 9 Years ago kieraelsies · Accepted Answer

There are quite a few posts on the subject here on StackOverflow:

Remove header and footer from
window.print()

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

Can I remove the URL from my print css, so the web address doesn't
print?

How to remove the URL from the printing
page?

Disabling browser print options (headers, footers, margins) from
page?

Looks like it works by using the @page media property in combination with the print media property:

@media print {

    @page { margin: 0; }

  }

However, it only seems to work in Chrome (for the moment). Firefox can be made to oblige, though. Elsewhere, it was suggested to create PDF on the fly - or to use JavaScript to set at least the page title to an empty string.

Also, I'd question why you'd want to hide something your users are usually used to have control over.

To answer your question, though: The LA Times use bootstrap, which sets the page margin as follows:

...@page{margin:.5cm}...