title: Setting height relative to `window.innerHeight` not working
body: <p>This might be a very stupid question for some people, but I surely am not able to understand the problem behind this. The code is fairly simple, and goes as follows:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en-US"&gt;
      &lt;head&gt;
          &lt;title&gt;####&lt;/title&gt;
          &lt;meta charset="UTF-8"&gt;
          &lt;link rel="stylesheet" type="text/css" href="css.css"&gt;
      &lt;/head&gt;
      &lt;body onload="resizeDiv();"&gt;    
          &lt;div id="testElement"&gt;ABCD&lt;/div&gt;
          &lt;div id="secElement"&gt;ABC&lt;/div&gt;
          &lt;script type="text/javascript" src="javascript.js"&gt;&lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>html , body{
      height:100%;
  }
  #testElement{
      background-color:black;
      color:white;
  }
  #secElement{
      font-size:50px;
  }
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>(function immediate(){
      document.getElementById('secElement').textContent = window.innerHeight;
  }());
  function resizeDiv(){
      document.getElementById('testElement').style.height = (window.innerHeight - 50) * 0.9;
  }
  </code></pre>
  
  <p>Now, by this code, the <code>div</code> with <code>id</code> 'testElement' should have an height which is 90% of the <code>window.innerHeight - 20</code>. But, nothing seems to work. Please help.</p>