Guide to Setting Up and Debugging a Print Style Sheet – Inspect Print for Website

Guide to Setting Up and Debugging a Print Style Sheet

Learn about designing a print-friendly layout using CSS and debugging through developer tools!

How to Inspect or Debug Your

Print

First, let’s look at how to preview and debug the print sheet. We want to avoid constantly right-clicking on a page and selecting Print to view our page.

Google Chrome

Launch inspect mode by right-clicking on the page and selecting ‘Inspect.’ Alternatively, using CTRL + SHIFT + I works as well.

Click on the three dots on the top right of the Inspect console, follow the highlighted items, and select ‘Rendering.’

You will see a ‘Rendering’ window in the inspect window. Scroll down to find Emulate CSS media type and change the dropdown to print, as shown below.