I'm noticing this problem on MacIE5, but this may be occuring in WinIE5, as well, but I don't have that to test on...

I'm wanting to create a special <div> to be displayed when printed, but hidden on-screen.

Here's the HTML:
Code:
<head>
	<link href="public.css" rel="stylesheet" type="text/css" />
	<link href="public-print.css" rel="stylesheet" type="text/css" media="print">
</head>
<body>
	<div id="printlogoheader">
		<img src="print-logo-header.gif" width="630" height="87" />
	</div>
</body>
Here's the Screen CSS:
Code:
#printlogoheader {
	/* in print, we show a different logo header */
	/* on screen, we show the left column logo instead */
	display: none;
	}
Here's the Print CSS (separate .css file):
Code:
@media print {
	#printlogoheader {
		/* in print, we show a different logo header */
		display:block;
		text-align: left;
		}
}

IE5 is showing the printlogoheader on screen also, but it's also ignoring all of my print styles for other elements when printing... I can handle it ignoring my print styles, but it's horrible to see the printheader on screen...

Searching around here and Google, I thought I could bypass this with the "Commented Backslash Hack", but it didn't change anything.

Code:
@media print {
	/* Commented Backslash Hack - hide from MacIE5 \*/
	#printlogoheader {
		/* in print, we show a different logo header */
		display:block;
		text-align: left;
		}
	/* End Commented Backslash Hack */
}
I've also tried changing which CSS file is loaded first. Strangely, though, doing that, messes up how certain things print in the other browsers...despite the @media print{} distinction...


Thanks for any help!
Brandon