ansaurus

Question

Why does Internet Explorer 8 print invisible content?

Answer 1

+3 A:

IE has an option:

Tools / Internet Options / Advanced / Printing / Print background colours and images

which is off by default. This is why it's ignoring your background-color styles when printing.

RichieHindle 2009-06-10 12:05:49

I don't want users to change print settings, so this is not a solution for me. I ended up hiding the rest of the content as Jose Basilio suggested. Your answer however is correct to my question. This also gave me the best insight in the problem!

Ropstah 2009-06-10 12:31:40

Answer 2

+4 A:

The ideal solution is to put all your styles inside CSS classes instead of using inline styles. This gives you greater control and you can use the Media Type to define what is visible on the screen and what gets printed.

Here's an example of how you can approach this with CSS classes and Media Types.

<html>
<head>
<style>
@media screen,print{
  .container{
     background-color:#999999;position:relative;
     border:solid 1px black;width:500px;height:500px;
  }
}
@media screen {
  .hideForPrint{
     position:absolute;width:100px;height:200px;top:100px;left:50px;
     border:dashed 5px #cccccc;z-index:98;background-color:white;
  }
}

@media print {
  .hideForPrint,.hideForPrint2{
    display:none;
  }
}
</style>
</head>
<body>
<div class="container">     
        <div class="hideForPrint"></div>
        <div style="hideForPrint2"></div>
</div>
</body>
</html>

Jose Basilio 2009-06-10 12:06:22

I am using different stylesheets for print and screen. This was just an example. I my example the right answer would've been: Add "display:none;" to the 3rd DIV. +1 for giving an answer that is the same as the solution I already had!

Ropstah 2009-06-10 12:30:32

ansaurus

tags:

views:

answers:

Why does Internet Explorer 8 print invisible content?

related questions