Screen and Print

Using the @media command in style sheets

The two tables have different sizes set in the style sheet according to whether the media type is print or screen.
The "menu" to the left is visible on screen but not there when printed. Try "Print Preview" to see the difference without wasting paper. the style sheet from the head of this document is reproduced below to show how its done.
Steve.

Menu
This is where a
menu would be
in the screen
but not print
version

one

two

buckle

my shoe

This is all remarkably easy once you see it.

Put this in the HEAD of the HTML file:

 <style type="text/css">
	@media print {
		#t1  {width:100%;color:red;}
		#t2 {width:50%;color:green;}
		#sidemenu {visibility:hidden;}
	}

	@media screen {
		#t1  {width:500px;color:blue;background-color:AliceBlue;}
		#t2 {width:100px;color:blue;}
		#sidemenu {visibility:visible;border:1pt groove red;float:left;padding:1em;margin-right:2em;}
	}
 </style>

and for each element name its id, for example:

 <span id="sidemenu">...</span>

Stephen Woodruff