Html 如何沿父对象拉伸div'；IE11中的s tr高度

我有一些代码如下。如何让它在IE11中像在Chrome中一样工作？我需要沿着父母的tr高度拉伸div

<table>
  <tr>
    <td style="position: relative; width: 50px">
      <div style="height: 50px; background-color: #0C59CF"></div>
    </td>
    <td style="position: relative; width: 50px">
    <div style="position: absolute; 
     top: 0; 
     bottom: 0; 
     left: 0; 
     right: 0; background-color: #5cb85c">
    </div>
    </td>    
 </tr>
</table>

---

检查此问题的解决方案。在所有浏览器中都经过全面测试

这段代码就是一个例子，如果您在IE11中打开它，背景色只是说明了一个问题