CSSのtransform:perspectiveを利用して要素に遠近法のような効果を与えるとき、ブラウザの画面幅によって要素が表示されなくなります。 (Firefoxで確認。Chrome/IEでは正常でした。)

サンプルコード: http://jsfiddle.net/r1onp8j3/

サンプルコードをFirefoxで開き、Resultの横幅を縮めていくと表示されなくなります。

.text {
  transform: perspective(300px) rotateX(45deg);
}

何か指定のしかたが間違っているのでしょうか？ Firefoxでも表示できるようにする方法はありますか？

追記1: Firefoxのバージョンは34.0.5 (Windows)です。

追記2: サンプルではベンダプレフィックス-moz-transformを利用しています。(認識されていませんが)