在TD中使用相对位置/绝对位置？

我有以下代码：

<td style="position: relative; min-height: 60px; vertical-align: top;">
    Contents of table cell, variable height, could be more than 60px;

    <div style="position: absolute; bottom: 0px;">
        Notice
    </div>
</td>

这根本不起作用。由于某种原因，TD上未读取position：relative命令，并且通知DIV被放置在页面底部的内容容器之外。我试图将TD的所有内容放入DIV中，例如：

<td>
    <div style="position: relative; min-height: 60px; vertical-align: top;">
        Contents of table cell, variable height, could be more than 60px;

        <div style="position: absolute; bottom: 0px;">
            Notice
        </div>
    </div>
</td>

但是，这产生了新的问题。由于表格单元格内容的高度是可变的，因此通知DIV并不总是位于单元格的底部。如果表格单元格延伸超过60px标记，但其他单元格都没有，则在其他单元格中，通知DIV向下60px，而不是底部。

这是因为根据CSS 2.1，position: relativeon对表元素的影响是不确定的。说明了本，position: relative有在Chrome 13的预期效果，但不能在Firefox 4，在这里你的解决方案是增加一个div在你的内容，并把position: relative对div代替td。以下内容说明了position: relative（1）代表div商品，（2）代表td（不好）以及最后（3）代表div内部td（再次代表）的结果。

<table>
  <tr>
    <td>
      <div style="position:relative;">
        <span style="position:absolute; left:150px;">
          Absolute span
        </span>
        Relative div
      </div>
    </td>
  </tr>
</table>

这个技巧也很合适，但是在这种情况下，对齐属性（中间，底部等）将不起作用。

<td style="display: block; position: relative;">
</td>

表格单元格的内容（可变高度）可能超过60px；

<div style="position: absolute; bottom: 0px;">
    Notice
</div>

关于第二次尝试，您是否尝试过使用垂直对齐？要么

<td valign="bottom">

或使用CSS

vertical-align:bottom

如果执行“ display：block;”，也可以使用 在TD上，破坏了TD的身份，但是有效！