Re: printing CSS documents

In a message dated 1/12/99 2:30:53 PM Central Standard Time, ron@persimmon.com
writes:

<< My apologies if this is not appropriate for the group, but I have a
 question about the relationship between CSS and the browser's print
 functionality. It appears that the current browsers are unable to print
 HTML documents that are formatted with CSS rules. Is this a browser
 limitation that we can expect to improve over time, or is it a more
 fundamental problem with the nature of CSS? Has W3C published anything
 related to print capabilities?
  >>

This doesn't directly answer your post, Ron, but perhaps it will help. It
might be the browser version (should support HTML4, usually version >= 4) or
publisher? From this list, I understand even many 4.x browsers, including IE
and NN are not yet fully compliant with CSS1 or 2. Seems to me this list, or
the newsgroup comp.infosystems.www.authoring.stylesheets, is/should be the
place for your post. The folks here are helpful.

The CIWA.html newsgroup, last I checked, seems to be mostly guys engaged in
flame wars, with very little HTML discussion or authoring help going on. One
would think they'd be more mature, given their stated education levels. I may
check them later. Maybe.
 
I'm using MSIE4.01 on Win95 platform, printing to a PostScript Level
2-compatible laser printer. I've begun writing HTML4 docs with an externally
linked CSS2 stylesheet. I based the CSS file on the sample CSS file given in
the CSS2 recommendation [1], with a few additions and modifications to suit my
taste for the (first) site I'm developing. 

[1]  <A HREF="http://www.w3.org/TR/REC-CSS2/sample.html">Appendix A: A sample
style sheet for HTML 4.0</A> http://www.w3.org/TR/REC-CSS2/sample.html

My printouts of the web pages are just great, except that Hn headings seem to
have different (less) space above/below the headings than on-screen, and my
P.indent paragraphs do not print out with a first-line text-indent, unlike on-
screen. Thus the in-print paragraphs appear to run together. The ordinary P
paragraphs do have margin-top/bottom > 0. The P class="indent" paragraphs are
set with top/bottom margins of 0 (zero) so as to give a traditional paragraph
with a first-line indent.

If anyone can answer this, I'd appreciate it. Perhaps my problem and Ron's
have to do with a browser's print capabilities.

I would like to be able to set on-screen and in-print font-size independently,
but have not experimented nor read the CSS2 spec fully yet to see if I can set
font-size in @media print { } for instance. On some screens or some printers,
a visitor might want a smaller screen font size and larger print font size, or
vice versa. Visually impaired, including older, users, might want bigger
fonts; eagle-eyed folks might want tiny fonts. One may only (at least for
MSIE) set an overall, single default font-size in the internet options dialog.

Ron, I hope this helps. 

Sincerely,
Ben Whisman
MWhisman@aol.com

P.S.: Here are the relevant rules:

BODY, P, H1, H2, H3, H4, H5, H6	{	display: block; }

BODY	{
	background:		White;
	color:			Black;
	font-family:	'Times New Roman', 'Times', serif;
	font-size:		small;	/* default is medium, 12pt; */
	line-height:	1.20;
	padding:			8px;
	}

P			{	margin: 1.33em 0; } /* top/bottom left/right */

/* *Should be* same as browser's default Paragraph style. */
P.block	{ 	
	text-indent:	0em;	/* do not indent first line */
	/* left and right indents remain at default */
	margin-top:		1em;	/* space before para */
	margin-bottom:	0em;	/* space after para */
	}

/* A standard Paragraph Indent. Caution! No space before para.
means no space between previous item (whatever it is!) and the para. */
P.indent	{
	text-indent:	1em;	/* indent first line */
	/* left and right indents remain at default */
	margin-top:		0em;	/* no space before para */
	margin-bottom:	0em;	/* no space after para */
	}

/* heading properties */

H1, H2, H3, H4, H5, H6	{
	color:				Teal;
	font-family:		'Verdana', 'Arial', 'Helvetica', 'Geneva', sans-serif;
	text-indent:		0pt;
	font-weight:		bold;
	}

H1 { font-size: 2em; margin: .67em 0; }
H2 { font-size: 1.5em; margin: .83em 0; }
H3 { font-size: 1.17em; margin: 1em 0; }
H4 { font-size: 1em; margin: 1.33em 0; }					
H5 { font-size: .83em; line-height: 1.17em; margin: 1.67em 0; }
H6 { font-size: .67em; margin: 2.33em 0; }

@media print {
  @page         { margin: 10%; }
  H1, H2, H3,
  H4, H5, H6    { page-break-after: avoid; page-break-inside: avoid; }
  BLOCKQUOTE, 
  PRE           { page-break-inside: avoid; }
  UL, OL, DL    { page-break-before: avoid; }
}

Received on Tuesday, 12 January 1999 16:26:22 UTC