Page 1 of 1
Forum

Welcome to the Tweaking4All community forums!
When participating, please keep the Forum Rules in mind!

Topics for particular software or systems: Start your topic link with the name of the application or system.
For example “MacOS X – Your question“, or “MS Word – Your Tip or Trick“.

Please note that switching to another language when reading a post will not bring you to the same post, in Dutch, as there is no translation for that post!



How to preview CSS ...
 
Share:
Notifications
Clear all

[Solved] How to preview CSS Printed in Google Chrome

1 Posts
1 Users
0 Reactions
2,020 Views
 Hans
(@hans)
Famed Member Admin
Joined: 12 years ago
Posts: 2815
Topic starter  

While trying to optimize Tweaking4All for printing, I noticed how difficult it can be to see the print preview and tinker with the CSS code.
Well, until I found this trick ...

In Google Chrome, go to developer mode (F12).

Press +Shift+P (Mac) or Control+Shift+P (Windows, Linux) to open the Command Menu.

When visible, start typing "render" until you see the option "Drawer Show Rendering" - click this option.

Now more info becomes available, where you'll need to scroll down until you see "Emulate CSS media type". Here you can select "Print".

Google Chrome will instantly show your webpage as if it would prepare it for printing.

Note: This may work in other Chromium browsers as well (eg. Microsoft Edge, Apple Safari, Opera).


   
ReplyQuote
Share: