title: css 100% height body doesn't cover whole document
body: <p>I tried to create HTML document with one layer in center like that:</p>
  
  <pre><code>&lt;body&gt;
   &lt;div id="background"&gt;
    LONG TEXT HERE
   &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>and I set </p>
  
  <pre><code>html, body  {
      margin: 0;
      height: 100%;
      min-height: 100%;
      background-color: #color1;
  }
  </code></pre>
  
  <p>and </p>
  
  <pre><code>#background  {
      width: 80%;
      height: 100%;
      position: absolute;
      margin-left: 10%;
      display: block;
      margin-right: 10%;
      background-color: #color2;
      top: 0px; 
      bottom: 0px;
  }
  </code></pre>
  
  <p>But somehow if the text exceed height of the display and when I scroll down there is no background. I have checked in FireBug it looks like if the whole document is only the size of the initial window.
  I need to make it 100% height. Could you please help me?</p>