当使用rowspan时，IE设置行高度无效。

Question

当使用rowspan时，IE设置行高度无效。

4

我想知道为什么以下HTML代码无法正常工作。基本上，每当我在表格行上设置rowspan属性时，IE似乎会忽略我设置的高度：

<table border="1" cellpadding="0" cellspacing="0" width="100%">
  <tr>
    <td height="20">A</td>
    <td align="center" rowspan="3">
      Test
      <br />Test
      <br />Test
      <br />Test
      <br />Test
      <br />Test
      <br />Test
    </td>
  </tr>
  <tr>
    <td height="20">B</td>
  </tr>
  <tr>
    <td>C</td>
  </tr>
</table>

有人知道它为什么会表现出这种方式吗？

- vdh_ant

我认为如果你必须使用表格，那么在主表的左侧单元格中放置一个具有三行（每行一个单元格）的表格，会更加合理。您可以根据需要设置第二个表格的行高。 - AR.

我考虑过这个问题，但用户需要能够从表格中复制并粘贴到Word/Excel中，并且它可以正常工作... 因此，在单元格中嵌套表格/ divs 不是一个真正的选择... :( - vdh_ant

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Mike Veigel · Accepted Answer

我认为这里发生的情况是，IE将使剩余可用空间扩展以填充第一行跨越三行的第二个TD的高度。

考虑以下示例：

<table border="1" cellpadding="0" cellspacing="0" width="100%">
  <tr height="30px">
    <td>
      A
    </td>
    <td align="center" rowspan="3">
      Test
      <br />Test
      <br />Test
      <br />Test
      <br />Test
      <br />Test
      <br />Test
    </td>
  </tr>
  <tr>
    <td height="60px">
      B
    </td>
  </tr>
  <tr>
    <td height="100%">
      C
    </td>
  </tr>
</table>

在这里，我们可以看到IE的渲染是正确的，因为60px + 30px = <第二列的总高度，所以我们告诉最终的td高度为100％，以便占用剩余的空间，这样IE就不会将其分布在行中。

我尝试了几个不同的测试用例，并证明了这一点。首先承认我可能错了。