Internet Explorer中的表行高度

Fri*_*z H 10 html css internet-explorer

我有下表:

<table>
    <tr>
        <td style="height: 7px; width: 7px"> A1 </td>
        <td style="height: 7px"> B1 </td>
        <td style="height: 7px; width: 7px"> C1 </td>
    </tr>
    <tr>
        <td style="width: 7px"> A2 </td>
        <td> B2 </td>
        <td style="width: 7px"> C2 </td>
    </tr>
    <tr>
        <td style="height: 7px; width: 7px"> A3 </td>
        <td style="height: 7px"> B3 </td>
        <td style="height: 7px; width: 7px"> C3 </td>
    </tr>
</table>
Run Code Online (Sandbox Code Playgroud)

基本思想是第一行必须是7像素高.最左边和最右边的单元格(A1和C1)必须是7px宽,中间单元格(B1)必须根据表格的宽度进行缩放.底行(A3,B3,C3)也是如此.

然而,中间行需要按比例缩放 - 换句话说,它需要(tableheight - 14px).左侧和最右侧的单元(A2,C2)需要7个像素宽.

一个例子:

             7px              x               7px
          |------|-------------------------|------|

---       +------+-------------------------+------+
 |        |      |                         |      |
 | 7px    |      |                         |      |
 |        |      |                         |      |
---       +------+-------------------------+------+
 |        |      |                         |      |
 |        |      |                         |      |
 |        |      |                         |      |
 |        |      |                         |      |
 | y      |      |                         |      |
 |        |      |                         |      |
 |        |      |                         |      |
 |        |      |                         |      |
 |        |      |                         |      |
---       +------+-------------------------+------+
 |        |      |                         |      |
 | 7px    |      |                         |      |
 |        |      |                         |      |
---       +------+-------------------------+------+
Run Code Online (Sandbox Code Playgroud)

但是:在Internet Explorer中,宽度工作正常(列A和C是7px,列B动态缩放) - 但高度不是.无论我做什么,第1,2和3行都是桌子高度的33%.不幸的是我必须使用这个表,所以用一组DIV替换它不是一个选择.

我有以下DOCTYPE:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Run Code Online (Sandbox Code Playgroud)

我需要保留它,因为页面上的一些其他元素依赖于一些复杂的基于CSS的布局.

任何人都可以指出我正确的方向为IE鞭打这个形状?

编辑:之前应该提到 - 使用javascript动态调整此表的大小.

Gin*_*eer 8

在过去,我发现单元格的高度属性被单元格内的字体大小覆盖,即使没有字体存在.将字体大小设置为1或0像素,您的高度实际上会生效.


Chr*_*ale 1

您可以使用垫片,而不是使用高度属性(因为它会引起问题)。例如,一个透明的小 gif,您也可以将高度设置为您想要的值。你会这样做的gif:<img src="./gfx/spacer.gif" style="height:14px;" />