title: CSS background diappearing when Overflow is Visible
body: <p>I have a site that has the following basic structure. This site should have a background that is white, with an image that apears once, but instead it just inherits the colour from the <code>html{ }</code> declaration in CSS. All elements below the element that should have the background are transparent, and even though the background is being added (checked in Firebug), it seems that this is below the background defined in <code>html{ }</code>.</p>
  
  <p>This has only happened since I removed the declaration <code>overflow: none;</code> from <code>#content-container</code>, where as before that it worked. I need to remove this however, as changes that are occuring to the site require the nav menu to have dropdowns, so the container below has to allow overflow.</p>
  
  <p>Is there a specific CSS reason why this is happening? Or anything else I need to provide for someone to be able to help? Thanks.</p>
  
  <pre><code>&lt;div id="main-container"&gt;
  
      &lt;div id="header-container"&gt;
          &lt;div id="header-top"&gt;
              {Code}
          &lt;/div&gt;
  
          &lt;div id="header-middle"&gt;
              {Code}
          &lt;/div&gt;
  
          &lt;div id="header-nav"&gt;
              {Code}        
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div id="content-container"&gt;
          &lt;div id="content-left" class="index"&gt;  
              {Code}
          &lt;/div&gt;
  
          &lt;div id="content-right"&gt;
              {Code}
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div id="footer-container"&gt;
          {Code}
      &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>