使用：在伪元素后锚元素 - 浏览器差异

Question

我有一个<a>元素，之后我想显示一个>符号，使用:after伪元素。

的<a>元素的内容是动态的，因此它的宽度的变化，有时内容事件跨越几行（因为这<a>元件是<div>谁的宽度是固定的内侧）。

我想>的水平位置，开始在最长行的末尾。也就是说，当我给它right:0;规则，它应该是在元素的最右侧边缘（垂直位置并不重要，现在）：

这就是它在FF的行为方式，但在Chrome和IE中，>出现在最短行的末尾：

我想了解是什么原因导致了浏览器之间的差异，但更重要的是，我想所有浏览器表现得像FF - 放置:after在最长的行的末尾。那可能吗？

我把the above code上dabblet

Answer 1

那是因为你的a元素被设置为默认显示inline，和Firefox处理定位中inline元素略有不同，以Chrome和IE。

在两个Chrome和IE修复这个（同时保留在Firefox中的样子），只需给你的a元素的inline-block显示：

a { 
    position:relative; 
    display:inline-block; 
} 

Modified Dabblet demo。