Print stylesheets in IE

The culprit for my IE printing stylesheet problems:


#container {
margin-top: expression(document.getElementById("header").offsetHeight + "px");
}
#header {
margin-top: expression((0 - (this.offsetHeight + document.getElementById("container").offsetHeight)) + "px");
}


IE leaves whitespace and ignores display:none when using expressions inside the CSS file. Of course not because of the expressions but because IE doesn’t care whether those should be used when a website is beeing printed or not. I was having nightmares when my printed page version of our new website came out completely different in IE compared to FF or Safari. I had a big white margin at the top of the page and it did not want to go away. But I was using a separate stylesheet for printing and used display:none for all header elements. Nothing helped until I smelled something coming from my seperate IE stylesheet.

But as Internet Explorer ignored other stuff too in the past it took me about a hour to find out that IE wasn’t ignoring all CSS from the screen CSS file as I told it to. In fact it’s the IE expressions used in my IE-only stylesheet. Dang! Thanks to the brilliant article “IE expressions ignore CSS media type” about that “bug” on 456bereastreet.com - that saved me at least more headache.

In conclusion I just have to quote the last line of their article:

To sum it up: If you’re having problems with print style sheets in Internet Explorer for Windows, check your use of CSS expressions.