(display: block) doesn't work in print css

I've searced and searched...

[RDWebmaster]

Howdy,
I'm working on a print style sheet that I am linking from the head section of my document like this:

<link media="print" href="/print_styles.css" type="text/css" rel="stylesheet">
<link media="screen" href="/styles.css" type="text/css" rel="stylesheet">

I want to change the header image for the print version. I'm able to hide the print header from browsers by using the display: none; command. I'm also able to hide navigational content in my print preview and print using the same command. I'm running into a problem when I try to display: block; for the print header image - it doesn't display.

I've read that I should do something like:

../screen.css
.webhide {
display: none;
}
.printhide {
display: block;
}

../print.css
.webhide {
display: block;
}
.printhide {
display: none;
}

When I do this my print content does not display in browsers as it should. But when I look at the print preview my web content is present and my print header does not render. When I remove the .printhide class from ../screen.css it works as it should except for the print pageheader.

Why doesn't this work?

See my attempt in action
<Eeek!>

Thanks

<Ack!>

[edited by: Nick_W at 6:01 pm (utc) on Sep. 22, 2003]
[edit reason] no urls or sig files please [/edit]

[BlobFisk]

Welcome to WebmasterWorld, RDWebmaster!

Please review the TOS [webmasterworld.com] for WebmasterWorld, specifically regarding URL drops and signatures.

Your declerations for print, screen etc. are incorrect. They should look like:

@media print { 
 .class1 {..} 
 .class2 {...} 
} 

HTH