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

Question

在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上没有读取位置：相对命令，并且通知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，而不是在底部。

Answer 1

这是因为根据CSS 2.1，position: relative对表元素的影响是未定义的。说明这一点，position: relative对Chrome 13有所期望的效果，但在Firefox 4上却没有。你的解决方案就是div在你的内容周围添加一个而不是在内容position: relative上。下面说明了（1）关于商品的结果，（2）关于（不好），最后（3）关于a （好的）。divtdposition: relativedivtddivtd

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

Answer 2

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

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

Answer 3

表格单元格的内容，可变高度，可以超过60px;

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