title: give div 100% height of browser window
body: <p>I combined <a href="http://tympanus.net/Development/MorphingSearch/" rel="nofollow">morphsearch</a> with <a href="http://demo.tutorialzine.com/2010/09/google-powered-site-search-ajax-jquery/search.html" rel="nofollow">google search</a> and now have a custom search for my site. however, the morph search refuses to occupy 100% window height when called. My html..</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="morphsearch" class="morphsearch"&gt;       
      &lt;form id="searchForm" class="morphsearch-form" method="post"&gt;
          &lt;input id="s" class="morphsearch-input" type="search" placeholder="Search Dundaah..."/&gt;
          &lt;input class="morphsearch-submit" type="submit" value="Submit" id="submitButton" /&gt;         
      &lt;/form&gt;        
      &lt;div id="resultsDiv" class="morphsearch-content2"&gt;&lt;/div&gt;
   &lt;span class="morphsearch-close"&gt;&lt;/span&gt;
      &lt;span class="morphsearch-close2"&gt;&lt;/span&gt;        
  &lt;/div&gt;
   </code></pre>
  </div>
  </div>
  </p>
  
  <p>The links to the css, <a href="http://dundaah.com/test/component.css" rel="nofollow">component.css</a> the js <a href="http://dundaah.com/test/script2.js" rel="nofollow">script2.js</a> and <a href="http://dundaah.com/test/search.js" rel="nofollow">search.js</a> an example of the problem <a href="http://dundaah.com/docs/sun" rel="nofollow">website</a> (click on the red fist to see the search). I've tried 100vh, didn't work...much appreciated.</p>