Why doesn't this background print?

With browser settings for background images ON

[rocknbil]

Again, with browser settings set to print backgrounds and images, both IE 6/7, FF.
The image in #img-bg isn't printing. This code may be a bit convoluted but it's to allow layering of plain text links in various positions over a background header image, without using absolute positioning.

It leaves a space where the header should be, it just doesn't print.

<div id="header"> 
 <div id="img-bg"> 
 <div id="home-link"> 
 <a href="index.html" id="specialty"> </a> 
 </div> 
 <p id="main-head-leader">company contact info</p> 
 <div id="header-nav"> 
 <ul> 
 <li><a class="head-nav" href="about.html">About</a> ¦ </li> 
 <li><a class="head-nav" href="contact.html">Contact</a></li> 
 </ul> 
 </div> 
 </div> 
</div> 

CSS:

* { margin:0; padding:0; } 
body, html {  
 background-color:#C4D3F4;  
 background-image: url(/images/bg.gif); 
 background-repeat: repeat-x; 
 font-family: Georgia, Book Antiqua, Palatino, Times New Roman, Times, Serif; 
}  
#header {  
 width: 826px; 
 height:165px;  
 margin: 0 auto 0 auto;  
} 
 /* for Opera 6 on the Mac, the BG image bumps to the left if just put in #header */ 
#img-bg { 
 background-image: url(/images/header.jpg);  
 background-repeat:no-repeat;  
 margin:0; 
} 
/* Just for IE 6, surround the top spacing div in a wrapper.  
Could just use link for all others! */ 
#home-link { height: 118px; width: 826px; } 
#specialty {  
 display: block; 
 width: 826px; 
 height: 118px; 
} 
/* Fonts in PX to avoid bumping nav down */ 
#main-head-leader { 
 font-family: verdana,helvetica, sans-serif; 
 font-weight: 700; 
 font-size: 14px; 
 width:550px; 
 margin: 0 0 0 265px; 
 padding: 0; 
 color: #0000B0; 
} 
#header-nav { text-align: center; margin-right: 48px; } 
#header-nav ul { margin: 3px 0; white-space: nowrap; height: 36px; } 
#header-nav li {  
 display: inline;  
 list-style-image: none;  
 padding: 3px;  
 line-height: 23px;  
 font-size: 12px;  
 color: #ffffff; 
} 

[rocknbil]

If any of you have seen this and spied something so stupid it deems being ignored, my apologies. Please enlighten me. :-(

[Fotiman]

I just gave your code a try in FF (supplying my own images) and they did in fact print. However... they were so tiny that you almost couldn't see them. I'm not sure why though. Maybe try removing one style at a time and see if you get it to print correctly until you find what's causing the problem?

[edited by: Fotiman at 7:56 pm (utc) on June 28, 2007]

[appi2]

maybe you have just the media="screen" attribute? set.

eg
<style type="text/css" media="screen">

[Xapti]

Try a print media stylesheet, and including it in that (if it's identical CSS then just copy it).