PHPnews.io

A quick tip for working with Print Styles

Written by Eric L. Barnes / Original link on May. 22, 2020

If you have to do a lot of work with print styles it can get super annoying because the only way to preview your changes is to hit “command + p” in the browser and have it open the print pdf preview. It’s slow and cumbersome to do it that way and there is a much better solution.

Open the developer tools in Chrome or Brave, then go to options -> more tools -> rendering -> emulate css media type “Print”. Here is a screenshot showing the setting:

print-emulate.png?w=1024

After this you can inspect anything you want and see how it’ll look when printed right in the normal browser window.

ericlbarnes ericlbarnes

« What We're Building - Push deploy a Laravel app for free with GitHub Actions »