IE, Position absolute inherits position from fixed
<p>when placing an <em>absolute</em> positioned element inside a position <em>fixed</em> wrapper within a position <em>relative</em> wrapper, shouldn't the absolute element position relative to the relative parent rather than the fixed parent?</p>

<pre><code>&lt;div class="relative"&gt;
  &lt;div class="fixed"&gt;
    &lt;div class="absolute"&gt;
      Content
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>i've made an example since the question is quite confusing(Difference is clear when comparing example in IE and Chrome):
<a href="https://jsfiddle.net/y4qgvemt/2/" rel="nofollow">https://jsfiddle.net/y4qgvemt/2/</a></p>

<p>Tested in chrome 52 and in IE 11 on Windows 7</p>

<p>in chrome the absolute positioned element is 10 rem from the right, but in IE it is all the way to the right. Is this intended or some weird bug in IE? if so, anyone know a way to work around it?</p>