W3C home > Mailing lists > Public > public-css-archive@w3.org > February 2018

Re: [csswg-drafts] [CSS-22][CSS-21][CSS3] Stacking context complicated

From: Oriol Brufau via GitHub <sysbot+gh@w3.org>
Date: Fri, 16 Feb 2018 15:49:14 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-366273010-1518796153-sysbot+gh@w3.org>
In fact the spec defines [`z-index: auto`](https://drafts.csswg.org/css-position/#valdef-z-index-auto) with

> If the box has 'position: fixed' or if it is the root, it also establishes a new stacking context. 

It doesn't mention `position: sticky`, so it would seem they shouldn't create a stacking context. But of course CSS Position is not maintained and this is not reliable. I don't understand why, I think it's much more important than other things which are properly maintained.

So I tested a bit and it seems that both Firefox and Chrome create a stacking context, but Edge does not. https://jsfiddle.net/vtxw5us6/

Firefox does it since its initial implementation in [bug 886646](https://bugzilla.mozilla.org/show_bug.cgi?id=886646). See comments [63](https://bugzilla.mozilla.org/show_bug.cgi?id=886646#c63), [64](https://bugzilla.mozilla.org/show_bug.cgi?id=886646#c64) and [66](https://bugzilla.mozilla.org/show_bug.cgi?id=886646#c66).

Basically, it seems they just copied webkit, which decided to make `position: sticky` behave like `position: fixed` in this regard, see https://developers.google.com/web/updates/2012/09/Stacking-Changes-Coming-to-position-fixed-elements. Interestingly, `position: fixed` didn't create a stacking context back then on Firefox.

-- 
GitHub Notification of comment by Loirooriol
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2326#issuecomment-366273010 using your GitHub account
Received on Friday, 16 February 2018 15:49:16 UTC

This archive was generated by hypermail 2.4.0 : Thursday, 24 March 2022 20:26:46 UTC