views:

707

answers:

7

I am generating a document from HTML. Is there any way to force the HTML page to be one rendered as one printed page long?

I've done most of the page with <table> and <div> tags.

+1  A: 

You can use CSS to style the page and set it to a certain height / width... There's a good tutorial here.

Eppz
+5  A: 

No. You can't control the user's zoom level, printer settings, paper size (is he using A4 paper in Europe or legal in the US?) and all of the various other things that affect printer output using HTML.

The best you can do with HTML is make a very simple "printer-friendly" page and keep the content short. Alternatively you can build a PDF, which is designed to let you control how it's printed.

Welbog
PDF is the way to go if you want total control of the printed output.
Jim Petkus
“You can't control the user's […] paper size […]” — Imaging the printer would crop your paper to fit the authors settings. :)
Gumbo
+1  A: 

Sure. You have a couple of possibilities:

  • Convert your page into a large image.
  • Convert your page to PDF.
  • Annoy all your users with a page with fixed dimensions that scrolls left and right because it is too wide and makes it extremely hard to transport the information.
Bombe
The "image" method has its drawbacks - DPI resolution comes to mind. PDF seems like the easiest way.
Piskvor
A: 

No there isn't a way as you couldn't possibly know the printer type or paper size at the time of rendering the HTML.

My only suggestion would be to set the printer properties to scale the content to fit one page at the time of printing.

cyberbobcat
+1  A: 

Use PDF. You can force many things like font size, font type and many other parameters but any browser can decide they don't care and use whatever they want and so violate your prerequesites or decisions. HTML is not (repeat after me: is NOT) a presentation language.

In many cases, it will mostly work but nothing is certain.

Keltia
+6  A: 

Not exactly, but you can use a print-stylesheet:

<link rel="stylesheet" type="text/css" media="print" href="print.css" />

To set font sizes, paddings, etc. to physical units like 'pt' (that should never be used in a screen-stylesheet!) so that it ends up being more or less an A4 page, when rendered in a typical browser, with typical fonts, with a following wind. Nothing is guaranteed but you can optimise for the common case.

In print you don't have to worry so much about font size preferences or dpi settings, but you still can't control the margins the browser uses or the actual page size (US Letter is smaller than A4), so leave a good amount of wiggle room and test on the major browsers.

bobince
"Nothing is guaranteed but you can optimise for the common case." Well said. If you know how much actual content you're cramming into the page, you can very well make sure it fits most people's pages.
Kev
I'd also recommend optimizing for US Letter size because it's slightly smaller than A4. A4 will drive US Letter users crazy but US Letter will fit on A4 and the users might not notice.
Mr. Shiny and New
+1  A: 

No, but you can make the print view a lot smoother by using a dedicated CSS file for print media, like suggested above.

Then you could for example at least prevent a table from spanning over 2 pages by using "page-break-before: always;".

And finally you could also use "display:none;" on elements that are unnecessary like ads, nav bars, etc. to keep the page itself shorter (short enough for a single page, hopefully).

No guarantees, though.

DMeier