z-index ignored with transformed element and another element with position:relative;
Reported by
naniw...@gmail.com,
May 30 2016
|
|||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.63 Safari/537.36 Example URL: https://jsfiddle.net/2wm7eqam/ Steps to reproduce the problem: 1. give an element a css transform and set z-index to 2 2. on the same DOM-Level create another element position it relative and give it z-index: 1 3. move the transformed over the relative positioned element (eg. via translate, rotate) What is the expected behavior? the relative positioned element with z-index 1 should be below transformed element with z-index 2. What went wrong? the relative positioned element (z-index: 1) stays on top of transformed element (z-index: 2) Does it occur on multiple sites: N/A Is it a problem with a plugin? No Did this work before? N/A Does this work in other browsers? Yes Chrome version: 51.0.2704.63 Channel: stable OS Version: 10.0 Flash Version: Shockwave Flash 21.0 r0 might be related to https://bugs.chromium.org/p/chromium/issues/detail?id=613976&q=z-index&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified
,
Jun 1 2016
,
Jun 13 2016
You need to put position:relative on the z-index: 1 element. z-index only applies to positioned elements: https://developer.mozilla.org/en-US/docs/Web/CSS/z-index |
|||
►
Sign in to add a comment |
|||
Comment 1 by tkonch...@chromium.org
, May 31 2016Components: Blink
Labels: M-53 OS-Linux OS-Mac
Status: Untriaged (was: Unconfirmed)