853025 - Z-index layering isn't consistent during CSS3 transition.

Status: RESOLVED WORKSFORME

(Core :: Layout, defect)

Description

[andrewc]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/536.26.17 (KHTML, like Gecko) Version/6.0.2 Safari/536.26.17

Steps to reproduce:

I am doing some CSS3 transitions for a card flip animation where a card expands while it's opening. Here is an example.

http://jsfiddle.net/aclabaugh/TXfKV/1/

Click the second or third cards to see the bug.


Actual results:

While transitioning, the current card is layered under previous siblings despite having a higher z-index. Once the transition is complete it layers correctly.


Expected results:

The z-index for the transitioning card should pull the entire element above its siblings. The expanding element should be above the other cards.

Comment 1

[Loic]

I think a regression has been introduced to solve another issue. Before 2012-03-13, your testcase works as expected but the current card flickers during the transition.
Now, flickering is gone, but the current card is layered by the card besides it during the animation.

Regression range:
m-c
good=2012-03-12
bad=2012-03-13
http://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=5ec9524de1af&tochange=1ca7a94573f2

m-i
good=2012-03-11
bad=2012-03-12
http://hg.mozilla.org/integration/mozilla-inbound/pushloghtml?fromchange=5f8a4ddce900&tochange=eceb16d4057b

Suspected bug:
Matt Woodrow — Bug 731777 - Correctly recompute overflow areas for frames with transform perspective applied. r=roc

Comment 2

[Loic]

Attachment: Screenshot FF19 Win 7 (during animation)

Comment 3

[Alice0775 White]

In local build
Last Good: c9612c1006f6
First Bad: c9612c1006f6 with f621a747531a

Triggered by:
f621a747531a	Matt Woodrow — Bug 730166 - Mark frames with a hidden backface as transformed. r=roc

Comment 4

[Gregory Pappas [:gregp]]

The test case in comment 0 404s and I can't find an archive unfortunately.