[解決済み] webkit-transformを使用した場合、ポジション固定が効かない

質問

webkit-transform (および -moz-transform / -o-transform) を使用して div を回転させています。また、position fixedを追加して、divがユーザーとともにスクロールするようにしています。

Firefoxでは問題なく動作しますが、webkitベースのブラウザでは壊れています。webkit-transformを使用した後、position fixedはもう機能しません! どうしてそんなことが可能なのでしょうか？

解決方法は？

いろいろ調べた結果 バグレポート についてです。 クロミウム の Web サイトでこの問題について説明していますが、これまでのところ Webkit ブラウザではこの 2 つの効果を同時にレンダリングすることはできません。

スタイルシートに Webkit 専用 CSS を追加し、変形した div を画像にして背景として使用することをお勧めします。

@media screen and (-webkit-min-device-pixel-ratio:0) {
  /* Webkit-specific CSS here (Chrome and Safari) */

  #transformed_div {
    /* styles here, background image etc */
  }
}

ですから、Webkit ブラウザが FF に追いつくまでは、今のところ、昔ながらの方法で行う必要があります。

EDIT: 2012/10/24現在、このバグは解決されていません。

これはバグではなく、2つの効果が別々の座標系と積み重ね順序を必要とすることによる仕様の側面と思われます。 この回答で説明したように .