Comments on: When Printing Maims

By: Manjit Pardesi

Manjit Pardesi — Wed, 07 Nov 2007 15:49:31 +0000

Excellent advice here. I spent quite a long time wondering why my page is fine in ie7 and firefox when it comes to using my print stylesheet, but not in ie6, even though i had float:none.

Its was only here that i reelised that I my other base style sheet did not have a media type !!!!

Once I added screen as the media type to the base style sheet, all worked fine in ie6.

By: Andrew M

Andrew M — Thu, 19 Jul 2007 22:19:58 +0000

Just another tidbit of advice. Sometimes your print stylesheet will break completely if you don’t specify media=”screen” for your other stylesheets.

By: Jörgen Bang

Jörgen Bang — Thu, 13 Apr 2006 08:52:23 +0000

for my current project, removing floats would severely mess up the layout, so what worked for me getting printed pages look good in FF1.5 was doing what Jens Grochtdreis mentioned, and add display:table-cell to the div that wraps all the content (there always seem to be a div that does that)

cheers

By: Saha

Saha — Wed, 28 Dec 2005 14:13:55 +0000

Some months ago I worked on a print-stylesheet which worked perfectly, except for Mozilla. Only the first page was printed. Nothing was floated, so theoretically it should work.

By: Gerry Quach

Gerry Quach — Thu, 22 Dec 2005 00:37:43 +0000

I came across the “floated content disappears when printed” bug as well recently, but the funny thing is that it only happens in Firefox 1.5, but not Firefox 1.0.4! This is for the exact same website (unfortunately it’s an Intranet site, so I can’t make it available for all to see).

I’m wondering whether it’s some kind of regression bug…

Incidentally, it looks like the “CSS background shrinks to tiny size when printed” bug still hasn’t been fixed :(

By: Dan Davis

Dan Davis — Fri, 23 Sep 2005 17:14:00 +0000

Geez, Dan, are you an old-skool Mac user, too? Your “debugging” tips smack of how we used to figure out Extension conflicts! :D Thanks for reminding me why I hate OS 9…

By: Dan

Dan — Fri, 23 Sep 2005 13:28:30 +0000

Dustin, I suppose it would technically qualify as a missed rule. From my perspective this means a "bug" in the style sheet. There are however, actuall "bugs" in Firefox's Print Preview, as mentioned in the ALA article comments.

By: Dustin Diaz

Dustin Diaz — Thu, 22 Sep 2005 20:46:06 +0000

Dan, thanks for the quick advice. was this in fact a bug or just a missed rule?

By: Lou

Lou — Mon, 19 Sep 2005 15:54:46 +0000

Dan,
Thanks for the interesting debugging tips.

By: Dan

Dan — Fri, 16 Sep 2005 20:07:38 +0000

In case any one would like to know how I went about figuring this out, my troubleshooting steps are below. Rather than reverse-engineer the whole site and track down every float and absolutely positioned item, I went for what seemed like a simpler and quicker approach.

1. Saved just the XHTML of Joe Clark’s article from ALA. Opened up the local copy in Firefox and did Print Preview. Noticed that the problem wasn’t there. So, I figured it must be caused by one of the styles.

2. Saved all the associated style sheets locally and change the XHTML to point to the local style sheets. Noticed that the problem returned.

3. Took out the style sheet references one by one and discovered that the problem only occurred with base.css.

4. Chopped out segments (in about 50 line increments) from base.css and reloaded Print Preview until the problem went away (about 3 tries). Once I had it narrowed down to 20 or so lines of code I looked for any suspicious floats. I tried removing them and the problem went away when I set .column {float: left;} to none.

5. Added .column {float: none;} to the local print style sheet to confirm that this was the culprit.

By: Jens Grochtdreis

Jens Grochtdreis — Fri, 16 Sep 2005 06:39:21 +0000

Hi Eric,

even if you un-float everything on the page, a usual hint to work versus the Mozilla-bug, it is not said that this will work perfectly. Some months ago I worked on a print-stylesheet which worked perfectly, except for Mozilla. Only the first page was printed. Nothing was floated, so theoretically it should work.

I added a display: table-cell; to the main DIVs which were unfloated and weverything worked like charm.
I hope the Mozilla-developers will conquer this year-old bug soon.

And: thanks for the ALA-printstylesheet, it was a mess before after the relaunch.

By: Eric Meyer

Eric Meyer — Thu, 15 Sep 2005 02:11:23 +0000

I updated the live site just before posting my previous comment. So the problem, it would seem, has been fixed. Glad to hear it’s working in 1.5b1 as well!

By: Roy Schestowitz

Roy Schestowitz — Thu, 15 Sep 2005 02:11:16 +0000

I found that Firefox fails to print properly when the following, for example, gets used:

a[href]:after {content: ” “;}

Then again, IE does not even ‘understand’ what :after means.

By: Laurens Holst

Laurens Holst — Thu, 15 Sep 2005 00:29:56 +0000

(using Firefox 1.5 beta 1 and the current version of ALA – dunno whether you already updated it on the live site)

By: Laurens Holst

Laurens Holst — Thu, 15 Sep 2005 00:27:56 +0000

Does it also look like that when you actually *print* it?

I”ve seen the print preview do many strange things before, but when you really print it it turns out well.

Except for a background colour issue, where it gets expanded to all the pages below it.

But the problem as I can see it there looks like the common one which is not actually present when printing.

~Grauw