要素がちらつく

要素がちらつく場合があります。
この現象が発生するのは次の何れかのパターンがあります。

• transformなどの2D/3Dプロパティとanimationプロパティまたはtransitionプロパティを組み合わせいる場合
• positionプロパティにfixedを指定している場合かつdisplayプロパティで表示・非表示を切り替えている場合かつ子孫要素にtransitionプロパティにallを指定している場合

transformなどの2D/3Dプロパティとanimationプロパティまたはtransitionプロパティを組み合わせいる場合

transformなどの2D/3Dプロパティとanimationプロパティまたはtransitionプロパティを組み合わせいる場合にちらつきが発生します。

原因は不明ですが、この現象を回避するには次のようにbackface-visibility:hiddenを指定することで回避できます。
また、backface-visibility:hiddenを指定しても回避できない場合は、overflow:hiddenを追記することで回避することができます。

positionプロパティにfixedを指定している場合かつdisplayで表示・非表示を切り替えている場合かつ子孫要素にtransitionプロパティにallを指定している場合

positionプロパティにfixedを指定している場合、かつdisplayプロパティで表示・非表示を切り替えている場合、かつ子孫要素にtransitionプロパティにallを指定している場合にちらつきが発生します。

こちらも原因は不明ですが、この現象を回避するには次のようにtransition-propertyの値をallではなく、変化を与えるプロパティのみにすることで回避できます。