title: How to make div 100% height relative to parent?
body: <p>I stuck with something like below. I need to make right-top div 100% height (its bgcolor will cover full height of main div).</p>
  
  <pre><code>&lt;body&gt;
      &lt;div id="main" style="width: 800px; margin: auto; text-align: left; border: 1px solid #628221; padding: 2px; background-color: #fff;"&gt;
          &lt;div id="left" style="float: left; width: 600px; background-color: #A7C864;"&gt;
              &lt;div id="left-top"&gt;left-top&lt;/div&gt;
              &lt;div id="left-bottom"&gt;left-bottom&lt;/div&gt;
          &lt;/div&gt;
          &lt;div id="right" style="float: right; width: 200px; background-color: #C7E48E;"&gt;
              &lt;div id="right-top"&gt;right-top&lt;/div&gt;
          &lt;/div&gt;
          &lt;div style="clear: both;"&gt;&lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>Working example here:
  <a href="http://marioosh.net/lay1.html" rel="noreferrer">http://marioosh.net/lay1.html</a></p>
  
  <p>Using table it is easy:
  <a href="http://marioosh.net/lay2.html" rel="noreferrer">http://marioosh.net/lay2.html</a></p>