相关疑难解决方法(0)

有什么办法可以让IE显示表格单元格作为实际块吗？

鉴于这种风格:

table,tbody,tr,td,div {
  display: block;
  border: 1px solid #0f0;
  padding: 4px;
}

这个HTML:

<table>
  <tbody>
    <tr>
      <td>R1C1</td>
      <td>R1C2</td>
      <td>R1C3</td>
    </tr>
  </tbody>
</table>

<div>
  <div>
    <div>
      <div>R1C1</div>
      <div>R1C2</div>
      <div>R1C3</div>
    </div>
  </div>
</div>

该表呈现与Firefox和Safari/Chrome中的嵌套div完全相同.但在Internet Explorer(8)中,该属性display: block无效.该表呈现的方式与我没有设置该属性完全相同.

我的主要问题是细胞不会破裂; 它们全部呈现在一条线上.(tbody和tr元素没有任何边界也没有填充.但是现在对我来说这不是问题.)

我在搜索时没有找到有关该问题的任何信息.quirksmode和其他地方的兼容性图表表明IE支持v.5.5display: block.关于表显示问题的任何讨论似乎都是在反向时 - 为非表元素提供任何display: table-*属性.

再一次,有什么办法可以让IE渲染表格单元格成块吗？

(真正的表格实际上是一个表格,包含表格数据.我希望保持这种方式,并且不显眼地重复它.)

我有一个简单的HTML表格,我想在每个现代浏览器(IE9,最新的FF,Chrome,Safari)中一致地呈现.如果我将宽度和"display:inline-block"应用于表格单元格,FireFox 4和Chrome将允许表格单元格"换行"到第二行,就好像它们只是常规的内联块元素一样.然而,在IE9中,单元格被视为经典表格单元格,并且不保持其宽度并且被压缩成一行.

代码的完整示例如下:http://jsbin.com/ujeber/6

是否有一个CSS属性可以应用于table,tr或td元素,以使IE9,Chrome和FireFox 4的行为方式相同？如果没有,这些浏览器中的哪一个正确遵循标准,或者在这种情况下标准是否含糊不清？

标记:

<table>
  <tr>
    <td>Test1</td>
    <td>Test2</td>
    <td>Test3</td>
    <td>Test4</td>
  </tr>
</table>

样式:

  td {
    width:300px;
    display:inline-block;
  }

  table {
    width: 650px;  
  }

我知道这不是使用table元素的典型/建议方式.我在渲染引擎的预期行为的上下文中询问.我不是在寻找与选择语义上合适的标签相关的答案.