title: Set floating div to height: 100%?
body: <p>I suspect there is no answer to this but I was wondering if there is a way to set the height of a floating div to 100%?</p>
  
  <p>I have two divs within a wrapper div:</p>
  
  <pre><code>&lt;div id="wrapper"&gt;
      &lt;div id="left"&gt;
      &lt;/div&gt;
      &lt;div id="right"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The right div has a set height and I want the left div to match it, so I created:</p>
  
  <pre><code>#wrapper {
      background-color: red;
      width: 200px;
      height: 100%;
      overflow: auto;
      padding: 5px;
  }
  
  #left{
      width: 90px;
      height: 100%;
      float:left;
      background-color: #ccc;
  }
  
  #right{
      width: 90px;
      height: 300px;
      float:right;
      background-color: blue;
  }
  </code></pre>
  
  <p>but the left div doesnt expand. Fiddle here: <a href="http://jsfiddle.net/8dstK/2/" rel="nofollow noreferrer">http://jsfiddle.net/8dstK/2/</a></p>
  
  <p>Would anyone know a way to achieve divs of equal height?</p>
  
  <p>Should I just use JQuery to grab the height of right div and apply it to left div?</p>