css alternativo stampa e schermo

sappe

css alternativo stampa e schermo

Ciao a tutti, avrei bisogno di aiuto con i fogli di stile, per la precisione due questioni:

per la stampa, come faccio a non far visualizzare il banner e il menù laterale? Il codice della pagina è questo:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
 <title>Linguaggio editoriale</title>
  <link href="style.css" rel="stylesheet" type="text/css" media="screen" >
	<link rel="stylesheet" type="text/css" media="print" href="style_stampa.css" />
  <meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
	<script type="text/javascript" src="cercaPagina.js"></script>
</head>
<body>
 <div align="center">
  <table class="maintable" cellpadding="0" cellspacing="0" summary="menu">
   <tr>
    <td colspan="3"><img src="immagini/banner.gif" width="727" height="240" alt="" id="banner"></td>
   </tr>
   <tr>
    <td rowspan="2" class="navbg" valign="top">
     <div id="nav">
      <p><span class="h2">Menu</span> <a href="index.html">Home</a>
      <a href="contatti.html">Contatti</a>
			<a href="bibliografia.html">Bibliografia</a></p>
			<hr />
			<p><a href="editoriaEditing.html">Editoria e Editing</a>
			<a href="linguaggioEditoriale.html">Linguaggio editoriale</a>
			<a href="figureProfessionali.html">Figure Professionali</a>
			<a href="composizioneLibro.html">Com'è composto un libro</a>
			<a href="normeEditoriali.html">Norme editoriali</a></p>
     </div>
    </td>
   </tr>
   <tr>
    <td rowspan="2" class="contentbg" valign="top">		
		 <div id="content">

... contenuto ...

		 </div>
    </td>
    <td valign="top" class="spacer"></td>
   </tr>
   <tr>
    <td height="2" class="spacer2"></td>
   </tr>
   <tr>
    <td colspan="3" class="creditsbg"></td>
   </tr>
  </table>
</body>
</html>

Mentre il css della versione stampa è questo (per ora):

body {
font-family: verdana;
font-size: 10px;
}

td {
font-family: verdana;
font-size: 10px;
}

img#banner {
display: none;
}

.maintable {
width: 727px; 
margin-top: auto;
}

.navbg {
width: 80px;
height: 274px;
}

.contentbg {
width: 471px;
height: 274px;
}

.creditsbg {
width: 727px;
height: 86px; 
}

.spacer {
width: 101px;
height: 277px;
}

.spacer2 {
width: 101px;
}

#nav {
display: none;
}

#banner {
visibility: hidden;
}

#content {
padding-left: 18px;
padding-right: 10px;
text-align: justify;
}

table#simboli {
border: 1px #000000;
border-collapse: collapse;
}

hr {
border: 0;
height: 1px;
}

Provo con visibility: hidden; oppure display: none;, naturalmente dando un id ai tr, ma non funziona... Avete dei suggerimenti?

la seconda cosa, se io volessi fare un css alternativo per uno schermo particolare, come ad esempio uno 800 x 600, come dovrei fare?
Invece di:

<link rel="stylesheet" type="text/css" media="print" href="style_stampa.css" />

che attributi devo specificare?

Scusatemi se sono cose banali... Ma non sono riuscita a trovare da sola una soluzione sul web. Grazie mille in anticipo!

sappe

Il primo problema l'ho risolto da me! Mi aiutate per il secondo per favore?

sappe

Risolti entrambi!! Grazie lo stesso ragazzi!! Buona fortuna a voi!!