title: how to stretch the header background color across the web browser?
body: <p>I am having a hard time to create make the background color stretch across the browser</p>
  
  <p>here is some code</p>
  
  <pre><code>body {
      font-size: 1.1em;
      font-family: "Myriad Pro", "Gill Sans", "Gill Sans MT", "Calibri", sans-serif;
      margin: 0px auto;
      padding-bottom: 25px;
      width: 980px;
  }
  
  
  div#black_bar{
      background-color: #000000;
  }
  div#header {
      height: 66px;
      font-family: arial;
      margin: 0 auto;
      color: #FFFFFF;
      margin-top: 5px;
  }
  </code></pre>
  
  <p>of course as you can see i have specified the width to be 980px in the body and this apply to the header of course, any ideas how to solve this</p>
  
  <p>and by the way this black bar is actually a div containing the header in it</p>
  
  <p>Thanks in advance.</p>