Webpage Printing
This site offers a Print button for all Reflections and Topics. Formatting the text on the pages to print nicely works quite well; how to specify what to do with images remains a bit unclear (as of August 2006).
The "trick", if it can be called that, to special print formatting is the media attribute
for CSS styling. The main stylesheet for this website is called in a LINK statement as follows:
<link rel="stylesheet" type="text/css" media="all" href="stylesheets/reflectionsLayout.css">
The media attribute tells the browser to use this sylesheet for all media types, i.e., for screens and printers. In the pages that are formattted to print is a stylesheet that cascades below the main stylesheet and therefore supercedes it. This stylesheet controls the printing.
The specification of
<body onload="window.print()">
(all lower case for XHTML purposes)
is what forces the print dialog to appear.
The remaining problem is how to specify CSS formatting for images so that text flows around them as we want. The formatting seems to work on screen for all browsers but only on some browsers for printing.
<style type="text/css" media="print">
/*
Style Sheet to print Philadelphia Reflections
*/
body {
margin: 0;
padding: 0;
width: 100%;
}
#wrapper {
margin: 0;
padding: 0;
width: 100%;
}
#center {
margin-top: 0;
margin-bottom: 0;
margin-right: 0;
margin-left: 0;
padding: 0;
}
#content {
font-size:120%;
}
</style>
(my thanks to http://centricle.com/tools/html-entities/ for HTML encoding)
(1120)
