html - 定位:after in Firefox这样的伪元素

Question

考虑以下 HTML:

<table>
  <thead>
      <tr>
          <th class="title">Test title</th>
      </tr>
  </thead>
</table>

以及以下 CSS:

table {
    width: 400px;
    border: 1px solid #ccc;
}

th.title {
    position: relative;
    text-align: center;
}

th.title::after {
    position: absolute;
    right: 5px;
    content: '>';
}

参见 JSFiddle http://jsfiddle.net/63EZB/1 .

我想要的是大于号出现在第th的右边。上面的代码在 Chrome 和 IE8+ 中都有效，但在 Firefox (28) 中无效。 Firefox 将标志绝对定位在窗口的右侧，例如不考虑 th 元素的 relative 位置。

出了什么问题？

Answer 1

寻找这样的东西 Link

CSS:

th.title::after {       
    margin-right: 5px;
    float:right;
    content:'>';
}