Often, I need a PDF rendering of a webpage that I have open in my browser.
I get get an approximation using Print-to-PDF, but it does not look the same, mostly due to layout difference, e.g. different width, or 100%-height-elements not working properly, or different styles due to CSS media queries. But it shows that in principle, a modern browser should have no difficulty to render a screen to PDF or another vector graphics format.
How do I make my (well any) browser save a web page as PDF?
My current work-around (although I’d still like to see a cleaner solution) is to set the following Firefox configuration keys:
print.print_margin_bottom = 0
print.print_margin_top = 0
print.print_margin_left = 0
print.print_margin_right = 0
print.print_unwriteable_margin_bottom = 0
print.print_unwriteable_margin_top = 0
print.print_unwriteable_margin_left = 0
print.print_unwriteable_margin_right = 0
print.print_bgcolor = true
print.print_bgimages = true
and then adjust print.print_scaling so that the width of the paper roughly corresponds my desired resolution when using my operating system’s “Print to PDF” feature.
It still leaves me with the problem that a web page layout that adjusts to a certain screen height will not work as intended, but it is a start.