Inside Technique : A Cure for our Printing Blues
By Scott Isaacs

Updates
10/22/1999 - Fixed infinite loop bug on long lines without spaces.

We have a huge problem. Our articles do not print well. This is because we had blinders on when we designed the backend templates and forgot that people might want to print our articles. Our problem is our 800x600 layout targets and the use of PRE tags to format long lines of code.

Fixing this the correct way is not an easy task. We need to revisit and rebuild every article on the system. We want to rebuild the system so we can provide a nice, long page that can be easily printed. This is something we are planning to do but will take not be finished anytime soon.

So, we started hunting for a short-term fix by taking advantage of client-side scripting. While our fix does not merge the article into a single view, it does allow each individual page to be printed properly for Internet Explorer users.

Fixing the 800x600 Problem

If you print from Internet Explorer 4.0 or later, you may have noticed that we have a fix for the TABLE problem. When you print our documents we apply a special style sheet that removes the menus providing more space for the article.

The print-only style sheet is included only in Internet Explorer 4.0 or later. The style sheet is associated with printing using the MEDIA="print" attribute. To force the contents to better fit on the page, this style sheet hides the navigation menu and reduces the width of the content area to 6.5 inches:

<STYLE MEDIA="print">
  #navmenu {display: none}
  #article {width: 6.5in}
</STYLE>

While this helps, it only goes so far. Since we format our code using PRE tags, the width is not honored for longer lines of code. This is because PRE only wraps when a line break occurs, not according to any specified width. Therefore, any long line of code is still clipped. Read on to learn how we used the new print events in IE5 to fix our formatting problems.

© 1997-2000 InsideDHTML.com, LLC. All rights reserved.