title: Set div 50% height of parent div
body: <p>I want the child div to be a 50% height of the parent, so if the parent div was 100%, the child div would be 50%, if the parent div was 1000px, the child div would still be 50%.</p>
  
  <p>Here's a basic fiddle of what i've done so far <a href="http://jsfiddle.net/6PA6k/17/" rel="noreferrer">http://jsfiddle.net/6PA6k/17/</a></p>
  
  <p>Here's the html</p>
  
  <pre><code>&lt;div class="wrapper"&gt;
    &lt;div class="button-container"&gt;
      &lt;div class="button"&gt;&lt;/div
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here's the css</p>
  
  <pre><code>* {
    margin:0;
    padding:0;
  }
  html {
    height:100%;
    width:100%;
  }
  body {
    height:100%;
    width:100%;
  }
  .wrapper {
    height:100%;
    width:100%;
    background:red;
  }
  .button-container {
    height:100%;
    width:50px;
  }
  .button {
    width:50px;
    height:50px;
    background:blue;
  }
  </code></pre>