The short answer is you can’t ‘always’ make it work. The long answer is that as soon as you add anything approaching formatting beyond plain text and plain fonts, you will run into complications and will need to become a CSS overlord. Your sentence describes reality very accurately:
there’s always some window geometry that causes the page to clash with
my intentions.
If you really need your web page to fit nicely on one page, the only 100% success-rate option is to create a made-for-print file : manually convert your web page into a nice-looking document in Microsoft Word, Pages for mac os, or InDesign, and export that to a PDF that you make available on the web page.
I have a web page that I want to take up a single printed page no matter how much content there happens to be. Specifically, I’d like the various measurements, especially font size, to scale up or down as necessary to fill out the printed page.
I’m already using the @media print
query to style things as necessary for printing. I thought I had everything satisfactory. It’s a case of the old “it looks right on my machine”. Printing from Firefox on Linux on my laptop to my particular printer looks perfect. But a friend printed the same page the other day from her computer/operating system/browser/printer combo and the text was on the small side making it harder to read. In addition, there was around 1/4th to 1/5th of the page left blank at the bottom.
On other pages (not intended for printing), I’ve played with things like vw
and vmin
to try to get elements as large as possible while fitting completely on the screen. But there’s always some window geometry that causes the page to clash with my intentions.
Is there a way to reliably encode my intention in CSS that I want the content to scale to the size of one page?
I was afraid of that. Thank you. Although, according to this (
The comment from 2014 in that article also mentions a it’s only a 5mm difference on the printed page 🙂 PDFs are very stable now, but if you want even more pixel stability use PNG, although you will lose the ability to copy paste the text which you would have from a PDF.