opacity < 1 on cube faces causes flickering during rotation animation

Fixed Issue #12091331


Ana T.
May 22, 2017
This issue is public.
Found in
  • Microsoft Edge
Found in build #
Reported by 1 person

Sign in to watch or report this issue.

Steps to reproduce

  1. Create a simple CSS cube and give its faces opacity: .8 (or any subunitary value).

  2. Set a rotation animation around more than one axis.

Expected result: cube rotates smoothly, no flickering. This is the result in Chrome and Firefox.

gif of expected result

Actual result in Edge: faces are occasionally in wrong 3D order and flicker as the cube rotates.

gif of actual result in Edge

Note that this doesn’t happen in Edge either if the opacity is 1 or if the cube rotates around only one axis.

Live test: http://codepen.io/thebabydino/pen/YVdwNd

May need to define pow function in the css:
@function pow($number, $exponent) {
  @if (round($exponent) != $exponent) {
    @return exp($exponent * ln($number));
  $value: 1;
  @if $exponent > 0 {
    @for $i from 1 through $exponent {
     $value: $value * $number;
  } @else if $exponent < 0 {
    @for $i from 1 through -$exponent {
      $value: $value / $number;
  @return $value;


0 attachments

    Comments and activity

    • Microsoft Edge Team

      Changed Assigned To to “James M.”

      Changed Assigned To to “Rick J.”

      Changed Assigned To to “Rob A.”

      Changed Assigned To to “Chris R.”

      Changed Assigned To from “Chris R.” to “Geoffrey T.”

      Changed Status to “Confirmed”

      Changed Title from “opacity < 1 on cube faces causes flickering during rotation animation” to “opacity < 1 on cube faces causes flickering during rotation animation”

      Changed Assigned To from “Geoffrey T.” to “Augusto R.”

      Changed Steps to Reproduce

      Changed Status from “Confirmed” to “Not reproducible”

      Changed Status from “Not reproducible” to “Fixed”

    • Hello,

      Thank you for providing this information about the issue. We are pleased to report this feature is fixed in Edge and will be available in an upcoming insider build.

      Best Wishes,
      The MS Edge Team

    You need to sign in to your Microsoft account to add a comment.

    Sign in