How to design css for printing a label

When a user of my site clicks a "print the label" button, he is sent to a page where only the label appears on a white background and the print dialog box opens. My question is about how to "think" the css for this label so that it is printed on the f开发者_JS百科ull paper width, whatever paper it is (US, A4, ...).

Should I use percents for sizing everything, boxes, margins, ...? ems for fonts? or points? Should a css reset be used first?

Is there a good resource on the net for this kind of css application?

Update: I made it with floating sections and percentage widths that layout well on regular paper. So consider this question closed.

I guess the trick is to make the layout as fluid as possible. And avoid using px as a measure. Here is one good article: CSS Design: Going to Print

It could be quite a challenge to scale everything correctly if your label contains different sections of data.

The way I would go about it is generate a single SVG image and scale that. SVG is designed for scaling, while (X)HTML is designed to re-flow content depending on resolution.

SVG is just some xml that can be embedded right in your HTML, look here for examples.

You should avoid using position:absolute/fixed, float:left/right.

Pt is best for print fonts, though it doesn't really matter most of the times.