title: div percentage not working with parent
body: <p>This is my code. I want the background of #splash to be 90% of the page.</p>
  
  <pre><code>a, span, p, h1, h2, h3, h4, h5, h6, body {
      margin: 0;
      padding: 0;
      outline: none;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
  }
  a, a:focus, a:hover, a:active{
      text-decoration: none;
      color: inherit;
      cursor: pointer;
  }
  p, h1, h2, h3, h4, h5, h6{
      font-family: 'Open Sans', Helvetica, Arial, sans-serif;
  }
  body{
      overflow-y: scroll;
      overflow-x: hidden;
      background-image: white;
      height: 100%;
      width: 100%;
  }
  .inner{
      width: 85%;
      position: relative;
      margin: auto;
  }
  #splash{
      height: 90%;
      background-color: red;
      width: 100%;
      position: relative;
  }
  </code></pre>
  
  <p>and HTML</p>
  
  <pre><code>&lt;html&gt;
  
  &lt;body&gt;
      &lt;div id="splash"&gt;
          hi
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><a href="http://jsfiddle.net/L6KGk/" rel="nofollow">http://jsfiddle.net/L6KGk/</a></p>
  
  <p>I looked into it and saw that the parent <code>body</code> had to be 100% as well. Although, it is still not working so I don't know. </p>
  
  <p>Thank you very much for your responses. </p>