Firefox Printing

Earlier today I wanted to print a web page for some offline reading. It was a page from a blog, featuring a left-handed nav/info bar and content on the right. Of course, I only wanted to print the content area. I tried printing, hoping for a print stylesheet that would supress the navbar. No such luck (note to self: implement a print stylesheet for your own glass house, and put down that stone).

I then tried turning off styles, figuring I could omit the pages of the printout which contained the navbar. I was surprised to find that Firefox prints using the default style sheet when styles are turned off (View|Page Style|No Style) (note to self: check Bugzilla, report if needed).

I considered adding a user stylesheet, hoping that it would cascade with the existing stylesheet. In trying to figure out what my stylesheet should do, I used the DOM inspector. I was disappointed to find the layout used a 1 row <table> with with 2 <td>s to achieve layout (note to self: you don’t do that- good job). No wories, judicious use of a following sibling CSS selector did the job:

td {display:none} /* don't show <td>s */
td+td {display:block} /* okay, show <td>s that follow another td */

The net affect is that only the first <td> (in each <tr>) is hidden. Perfect for this application. I tested this CSS snippet using the Edit CSS feature of fantastic the Web Developer Toolbar. On a whim, I tried printing, and was pleased to see that Firefox printed using the edited CSS.

Update: I dutifully checked Bugzilla. Bug 260762 looks like a match.

Both comments and pings are currently closed.

4 Responses to “Firefox Printing”

  1. Sam Buchanan Says:

    Nifty technique, thank you. I use the DOM inspector to outright delete the elements that I don’t want to print.

  2. Jason Clark Says:

    Never finesse what you can brute-force…<br/>

    Excellent Sam, Thanks! I had no idea you could delete elements using the DOM inspector. I just tried it… oh, the power!

  3. chornbe Says:

    With great power comes great… ability to do terribly distructive stuff. MUWAHAHAHHAHAHA!

  4. Neil Says:

    “Nuke Anything”<br/>

    I use the Nuke Anything extension for this. Right click on anything you don’t want to see, select “remove this object”, and it’s gone. It even works on individual paragraphs of text, which can be convenient when printing articles without their attached reader feedback.