Wray Bowling Wray Bowling - 16 days ago 4
CSS Question

Is it possible to spoof @media print?

I'm working on some print stylesheets. The only way I can view the results of my changes is by using a print preview. It's very tedious and clunky. Even though it will be inevitable once I need to test page-breaks, I have been trying to figure out if there is a way to spoof the

@media print
in the browser so I can use the inspector, and see all of the things that are switched around to look different for printers.

A good example is that if you have Bootstrap installed, they are using a trick with anchors so that the URL is printed out in parens after the anchor text. So, while I can temporarily change my own print stylesheet to
@media screen
, I don't see those Bootstrap
@media print
things until I hit print preview.

Answer

Yes. In chrome go to Developer Tools > Emulation > Media > check css media and select print from the dropdown

Comments