title: CSS Div Layout stretch to fit width and height
body: <p>I am trying to make a phpBB theme, but am having trouble setting up the DIV's the way I envisioned the page to be.</p>
  
  <p>This is what I am looking to do.</p>
  
  <p><a href="http://imgur.com/n6eZbsT" rel="nofollow">http://imgur.com/n6eZbsT</a> (image to help with understanding)</p>
  
  <p>This is what I had so far.</p>
  
  <p>index.html</p>
  
  <pre><code>&lt;body&gt;
  &lt;div id='container'&gt;
      &lt;div id='header'&gt;
      &lt;/div&gt;
  
      &lt;div id='sidemenu'&gt;
      &lt;/div&gt;
  
      &lt;div id='content'&gt;
      &lt;/div&gt;
   &lt;/div&gt;
  
  &lt;/body&gt;
  </code></pre>
  
  <p>css.css</p>
  
  <pre><code> *{
      padding: 0px;
      margin: 0px
      }
  
   #header {
      width:100%;
      height:50px;
      background-color:#6FF;
      }
  
   #sidemenu {
      display: block;
      position:absolute;
      width:100px;
      height:100%;
      background-color:#6F6;
      }
  </code></pre>
  
  <p>The problem with this is that the sidemenu DIV overflows to the bottom of the page and creates a scrollbar.</p>
  
  <p>I have tried looking for a solution, and only managed to get the overflow to go away by using <code>bottom:0px;</code> inside the sidemenu css</p>
  
  <p>But this pushes the header to the right, and sidemenu to the top left corner like this..</p>
  
  <p><a href="http://imgur.com/LKk9VtF" rel="nofollow">http://imgur.com/LKk9VtF</a></p>
  
  <p>I am stuck here, css gives me a huge headache ahaha. Can anyone please help me with a solution?</p>
  
  <p>Thank you so much!</p>