Print Avery labels using CSS and HTML

It really come in handy… thanks for sharing.

Boulder Information Services

A client for whom I provide web services asked me if I could help her print barcode labels from their data.

Now, I’ve created Avery labels using Office, Illustrator, even Photoshop — but never using web technologies. You just don’t have a lot of control printing from your browser using CSS.

Or do you…? After all, we’ve always been able to specify real-world measurements such as “in” and “cm” using CSS.

I bought Avery 5160 labels because they seemed big enough to allow me to be a little sloppy while still providing many stickers per page.

A quick test proved that I could specify the page margins, label sizes, and gutter widths in inches. And both Firefox and IE allowed me to set the print margins to 0, leaving control of the layout to my CSS. Here’s what the print preview looks like from Firefox:

It’s not perfect, but it’s…

Lihat pos aslinya 400 kata lagi

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s