title: Can't get background image to show in div?
body: <p>AS the subject outlines, the background div will not show, I thought you needed to define the width and height, but this doesnt work, ive checked the names and filepaths and these all seem ok.</p>
  
  <pre><code>&lt;head&gt;
  &lt;link rel="stylesheet" type="text/css" href="css/invoicestyle.css"/&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="wrapper"&gt;
  &lt;div id="header"&gt;
      &lt;div id="logo"&gt;&lt;img src="images/ATT3006209.jpg" /&gt;&lt;/div&gt;
      &lt;div id="card"&gt;&lt;img src="images/ATT3006207.jpg" /&gt;&lt;br /&gt;&lt;img src="images/ATT3006208.jpg" /&gt;&lt;/div&gt;
      &lt;div class="clear"&gt;&lt;/div&gt;
      &lt;div id="tagline"&gt;&lt;p&gt;Tagline goes here&lt;/p&gt;&lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div id="bar"&gt;
          &lt;div id="left"&gt;&lt;/div&gt;
          &lt;div id="middle"&gt;&lt;/div&gt;
          &lt;div id="right"&gt;&lt;/div&gt;
          &lt;div class="clear"&gt;&lt;/div&gt;
      &lt;/div&gt;
  
  &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <pre class="lang-css prettyprint-override"><code>body{
  background:#FFF;
  font-family:Arial;
  font-size:12px;
  }
  
  .clear{
  clear:both;
  }
  #wrapper{
  width:1000px;
  margin:auto;
  }
  #logo{
  float:left;
  }
  #card{
  float:right;
  }
  #card img{
  padding-bottom:5px;
  }
  
  #bar{overflow: hidden;}
  #left{
  background: url("images/left.jpg") no-repeat;
  width:10px;
  height:50px;
  float:left;
  display: block
  }
  #middle{
  background: url("images/mid.jpg") repeat-x; 
  width:980px;
  height:50px;
  float:left;
  display: block
  }
  #right{
  background: url("images/right.jpg") no-repeat;
  width:10px;
  height:50px;
  float:right;
  display: block
  }
  </code></pre>