Question

In chrome print preview, under Options tab, the default is having Headers and footers ticked on. Is it not possible to set it default to off via javascript / chrome extension / anything outside telling user to do it manually?

OR is it possible to remove the date displayed there?

Answer 1

In short, yes you can control this behavior. It is actually very bizzarre — as appears to have been originally answered in the question “In Google Chrome, Docs Can Control Headers and Footers from Javascript?” The secret to this behavior is in the @page CSS property*.

If you set this exact style:

    @page { margin: 0; }

Then you get the desired behavior, the headers & footers option disappears:

This appears to be an undocumented behavior of Google Chrome, or at least not widely known — cursory digging in to their developer docs garnered nothing. Google uses it themselves throughout their own web-apps, so it’s probably not a secret, but I couldn’t find any official notes on it.

Notably, a margin of 0 does not simply disable the “headers & footers” option, it actually causes it to disappear from the menu entirely ( by quickly folding ).

Experimentation reveals that other variations of this do not have the same effect. For example margin: 0; margin-left: 10cm; does not cause this behavior.

If you do choose to implement this solution, it means forfeiting the ability to control those margins through the @page property — you should instead be controlling them as part of a CSS print-media stylesheet. Bummer that Chrome kind of destroys the @page property this way. That said, FF still does not support @page ( as of now ) so it’s not a perfect solution to begin with.

---

*More information about the @page property

The @page CSS is supposed to control the margins of the printed page, the specification says:

The page box is a rectangular region that contains two areas:

• The page area. The page area includes the boxes laid out on that page.
  The edges of the first page area establish the rectangle that is the
  initial containing block of the document. The canvas background is
  painted within and covers the page area.

• The margin area, which
  surrounds the page area. The page margin area is transparent.

Most modern browsers support the @page CSS property. Firefox is the standout who doesn’t, though they do fully document it in their developer resources, and their issue tracker has a ticket for this that goes back 10 years. The most recent action on it was today, so perhaps FF will provide @page support soon.