Problem med noprint-class i css-filen?

Jag har noprint class i min css-fil och dens funktion är att gömma
de områden på html-sidan, som jag inte vill att skall synas vid en utskrift.

Problemet är det inte fungerar på följande ställe, se kod 1.

Kod 1.

<span class="noprint"> 
<td class="row2"> 
<span class="fontsetup"> 
Ändra 
</span> 
</td> 
</span>

medan den fungerar på följande ställe, se kod 2:

Kod 2.

<span class="noprint"> 
<span class="fontsetup"> 
<form> 
<input type="button" value="Skriv ut sidan" onclick="printpage()"> 
</form> 
</span> 
</span>

Innehållet i css-filen

.noprint{ 
  display: none; 
} 
@media print{ 
  body{ background-color:#FFFFFF; background-image:none; color:#000000 } 
  page-break-inside: auto; 
  #ad{ display:none;} 
  #leftbar{ display:none;} 
  #contentarea{ width:100%;} 
}

Vad kan detta bero på? Kan nån hjälpa mig?

Hmm...
Kod 1 fungerar inte pga att den är felaktigt skriven HTML ;)

Det fungerar helt enkelt inte att lägga in en <span> runt en <td> på det där sättet överhuvudtaget (i praktiken kommer det som ligger "mellan raderna" och "mellan cellerna" i en tabell generellt sett att hamna ovanför tabellen rent grafiskt när sidan visas)...

Testa följande istället:

<td class="row2 noprint"> 
<span class="fontsetup"> 
Ändra 
</span> 
</td>

Får du problem med specificiteterna (dvs att stilar "läcker över från andra inställningar"), kan du förstärka din noprint-klass såhär:

@media print{ 

.noprint, .noprint * { 
  display: none !important; 
} 

}