Search code examples
cssinternet-explorerinternet-explorer-8print-style

Why are my print styles not being rendered in IE 7 and IE 8?


I have a webpage with 2 stylesheets being included:

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

The print styles work just fine with chrome, safari, firefox, and IE9, but completely breaks in IE7 and IE8. Certain images that should be hidden are not, others that should be visible are not. It looks like a mess, despite the fact that if I load both stylesheets for screen in IE7 and IE8, everything looks exactly as I expect.

I'm unfortunately not able to link to the page, as it's a client site in progress, but I'm grasping at straws here if anyone has any ideas.


Solution

  • Turns out, the problem was that HTML5 elements weren't rendering on print properly, and the HTML5 shiv doesn't support printing by default.

    Luckily for me(and you), there's an IE print protection plugin made by Alexander Farkas over here: https://github.com/aFarkas/html5shiv

    EDIT:

    Looks like Modernizr now has a print shiv option if you're using Modernizr for all your shiv-ing (totally a word) needs: http://modernizr.com/download/