title: Opera (only) - margin of absolutely positioned child element pushes it up the next sibling, also absolutely positioned
body: <p>I have quite simple markup:</p>
  
  <pre><code>&lt;div id="container"&gt;
      &lt;div id="content"&gt;&lt;/div&gt;
      &lt;div id="ta-container"&gt;
          &lt;div id="gripper"&gt;&lt;/div&gt;
          &lt;textarea&gt;&lt;/textarea&gt;
      &lt;/div&gt;
  &lt;/div&gt;​
  </code></pre>
  
  <p>And I style it like a basic chat window might look. Please see the code here: <a href="http://jsfiddle.net/pavek/rdxN5/3/" rel="nofollow">http://jsfiddle.net/pavek/rdxN5/3/</a></p>
  
  <p>This looks perfectly well in FF, Chrome, IE, but <strong>not in Opera</strong> (12.11, the latest now). The most confusing thing is how two absolutely positioned elements within container affect each other -- I cannot comprehend that.</p>
  
  <p>I'd like to see possible solutions for this issue. Note: I prefer to avoid manipulating the <em>height</em> of div#content.</p>