css - :before pseudo で行う Firefox での三角形の奇妙な動作

Question

:before および :after 疑似要素を使用して形状を作成しています。この場合、長方形の端として表示する必要がある三角形。なぜそれが起こっているのか理解できません。画像はこの画像 1 のように見えるはずですが、画像 2 のように見えます。

画像 1 (FF を除くすべてのブラウザー):

画像 2 (Firefox):

ここで尋ねられたように、コードにjsfiddleがあります：

http://jsfiddle.net/LpXxM/

.news-info a:before {
  position: absolute;
  top: 0;
  left: -20px;
  border-right: 20px solid rgba(64, 64, 64, 0.85);
  border-top: 20px solid transparent;
  content: "";
}

確認したところ、問題は単純に左側の css プロパティにあるようです。left: 20px の代わりに left: 22px とすれば、Firefox で動作しますが、もちろん残りのブラウザは間違っています。では、なぜFirefoxは他のブラウザと2pxの違いがあるのでしょうか? そして、これを解決する方法、またはこの問題を対象にする方法は?

サイトのリセットとして正規化を使用しています。誰か助けてくれませんか?!