0

我有一个在 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) 可以有宽度。

4

1 回答 1

0

删除所有这些display属性，并给你它需要<table>的：width

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

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

这是一个演示

于 2013-10-07T12:29:27.693 回答