title: Respect height of absolute elements inside a relative element
body: <p>Can it be possible for the height of the relatively positioned element to adjust to the height of it's child element?</p>
  
  <hr>
  
  <h3><a href="http://jsfiddle.net/XTVbu/" rel="nofollow noreferrer">See Demonstration</a></h3>
  
  <hr>
  
  <h2>HTML:</h2>
  
  <pre><code>Items:
  &lt;div id="love"&gt;
      &lt;textarea id="magic"&gt;&lt;/textarea&gt;       
  &lt;/div&gt;
  Dung:​​
  </code></pre>
  
  <h2>CSS:</h2>
  
  <pre><code>#love{
      position:relative;
      background:#eee;
      width:60px;
  }
  #magic{
      position:absolute;
      width:20px;
  }
  </code></pre>
  
  <h2>Output:</h2>
  
  <p><img src="https://i.imgur.com/cV2HH.jpg" alt="Dungbombs!"></p>