html - Internet Explorer 中的表格行高

标签 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>

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

然而,中间一行需要缩放高度 - 换句话说,它需要是 (tableheight - 14px)。最左边和最右边的单元格(A2、C2)需要 7 像素宽。

一个例子:

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

---       +------+-------------------------+------+
 |        |      |                         |      |
 | 7px    |      |                         |      |
 |        |      |                         |      |
---       +------+-------------------------+------+
 |        |      |                         |      |
 |        |      |                         |      |
 |        |      |                         |      |
 |        |      |                         |      |
 | y      |      |                         |      |
 |        |      |                         |      |
 |        |      |                         |      |
 |        |      |                         |      |
 |        |      |                         |      |
---       +------+-------------------------+------+
 |        |      |                         |      |
 | 7px    |      |                         |      |
 |        |      |                         |      |
---       +------+-------------------------+------+

但是:在 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">

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

任何人都可以指出正确的方向来为 IE 做好准备吗?

编辑:应该早先提到过——这个表是使用 javascript 动态调整大小的。

最佳答案

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

关于html - Internet Explorer 中的表格行高,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/727995/

相关文章:

html - z-index 不适用于图像和 p 标签

jquery - Google Map v3 仅自动刷新标记

css - 在打印中使用 HTML5 details 元素

css - 如何缩小 div 的高度以容纳更多内容?

javascript - 如何阻止 Internet Explorer 打开拖动的文件?

html - 现场直播时造型不适用于移动设备

javascript - 在 ViewModel 中拆分 AngularJS 中的代码

javascript - 为什么 textarea 中的值属性与 JS 值不同

php - 如何为IE8设置边框半径

jquery - 对于具有 CSS 定义的光标的 div,如果在该 div 隐藏时鼠标不移动,IE 不会自动重置光标