title: IE 10 Width Issue with Absolutely Positioned Child
body: <p>I have this issue where the child extends past the parent. The child has percentage width and is absolutely positioned. I created a fiddle here: <a href="https://jsfiddle.net/f2zf7par/" rel="nofollow noreferrer">https://jsfiddle.net/f2zf7par/</a></p>
  
  <pre><code>&lt;div class="grand-parent"&gt;
    &lt;div class="parent"&gt;
     &lt;table class="child"&gt;&lt;tr&gt;&lt;td&gt;test&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;test&lt;/td&gt;&lt;/tr&gt;
     &lt;/table&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  .grand-parent {width: 100%; max-width: 400px; height: 300px;  background: #000;}
  .parent {
   width: 100%;  position: relative;}
  .child {background: #fff; width: 50%; height: 50%;position: absolute; right: 0;}
  </code></pre>
  
  <p>How can I have IE behave the same way as other browsers?</p>