在 Internet Explorer 中的 div 内定位绝对表

Question

我有一个 在 div 内具有绝对位置的表格，并希望该表格与 div 内的文本保持一致。 Firefox 这样做是正确的，Chrome 需要 display:-webkit-box;让它工作。

但我的问题是，如何为 Internet Explorer 解决此问题？（IE 9 及更高版本）

.container { 
  width:250px; 
  height:250px; 
  background:red; 
  position:relative; 
}
.container table { 
  position:absolute; 
  top:20px; left:100px; 
  display:-moz-box; 
  display:-webkit-box; 
  display:-ms-flex; 
  display:box; 
}

<div class="container">
  <table cellpadding="0" cellspacing="0">
    <tr>
      <td>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</td>
    </tr>
  </table>
</div>

小提琴示例： http://jsfiddle.net/wLLGp/

注意：这是代码的简化版本，我无法真正更改 div 中的表格，我知道可以解决问题。

编辑：我使用的是响应式设计，所以只有外部 div (.container) 可以有宽度。

Answer 1

删除所有display 属性，并为您的<table> 提供它需要的width：

容器宽度：250px - 左100px：150px；

.container table {
    left: 100px;
    position: absolute;
    top: 20px;
    width: 150px;
}

Here is a demo