52

I'm not talking of the Print Preview - I mean to view the webpage in Firefox "normally", with access to e.g. the F12 Developer Tools, but I want the layout to be the same as if I was printing the page out.

gaazkam
  • 1,053

4 Answers4

68

Devtools Screenshot with a nice and friendly ponting arrow

There is now (June 2019) a nice button in the devtools. See this discussion mentioned in the answer by @interDist above.

Worthwelle
  • 4,816
Alexander Rutz
  • 837
13

From https://developer.mozilla.org/pl/docs/Tools/GCLI : Launch the Developer Toolbar with Shift+F2, then type: media emulate print

Somehow it doesn't solve my problem though, this what I see after this command differs from the Print Preview and from what is printed out... :(

gaazkam
  • 1,053
11

As of September 2018, no, there is no such option. The Developer Toolbar, mentioned by @gaazkam, was removed in Firefox 62 in September 2018. There is no replacement for the media emulate command in DevTools, although it may be given some priority now that the command line interface is gone. Discussion is also here: https://discourse.mozilla.org/t/how-to-media-emulate-print-without-developer-toolbar-gcli/30975.

interDist
  • 221
10

This can be done using the developer tools by pressing the 'Toggle print media simulation for the page' button in the styles panel.

Example of print tools

Jon Koops
  • 201