w3c / csswg-drafts

CSS Working Group Editor Drafts
https://drafts.csswg.org/
Other
4.46k stars 657 forks source link

[css-transforms-2][css-overflow-3] overflow: clip and 3d transforms #6374

Open frivoal opened 3 years ago

frivoal commented 3 years ago

This is a follow up from #6202, where a discussion of paint containment and 3d transforms uncovered a similar point about overflow: clip.

On the one hand it seemed desirable that overflow: clip would, unlike overflow: visible and like every other value of overflow, be listed among grouping properties and cause flattening of a preserve-3d scene. On the other hand, it might not be that simple:

The second one can easily be solved by saying that if either overflow-x or overflow-y is clip, then we flatten. Feels a bit like a hack to me, but maybe it's fine.

For the stacking context problem, someone with a deeper understanding than me (@dbaron?) should probably comment.

Ultimately, I don't think that we absolutely have to make clip cause flattening, as we theoretically could clip within the 3d scene, but @smfr has been clear that he'd rather avoid that, and others seemed to agree.

dbaron commented 3 years ago

So after reading § 3.2. Behavior specific to HTML in compositing-1, I'm less sure that there's even a meaningful difference between stacking context and grouping property, or, if so, what it would be. (And I added another column to my big test, and retitled one of the existing columns.) I agree with @smfr that overflow:clip should cause flattening in 3D transforms, and I think I'm also inclined to agree with his preference that it not create a stacking context (although my opinion there is much weaker). Maybe we want to just add it to the list of flattening conditions without describing it as a grouping property?

Also cc: @mattwoodrow @chrishtr.

dbaron commented 3 years ago

There was prior discussion in https://github.com/w3c/csswg-drafts/issues/1944#issuecomment-342603888.

mattwoodrow commented 3 years ago

This is a follow up from #6202, where a discussion of paint containment and 3d transforms uncovered a similar point about overflow: clip.

On the one hand it seemed desirable that overflow: clip would, unlike overflow: visible and like every other value of overflow, be listed among grouping properties and cause flattening of a preserve-3d scene. On the other hand, it might not be that simple:

* all the other things listed in "grouping properties" are things that create a stacking context, but `overflow:clip doesn't`

overflow:hidden is already a grouping property, and doesn't create a stacking context, so adding clip seems fine to me.

Ultimately, I don't think that we absolutely have to make clip cause flattening, as we theoretically could clip within the 3d scene, but @smfr has been clear that he'd rather avoid that, and others seemed to agree.

I very much agree, 3d clipping seems like a lot of complexity for little gain.

So after reading § 3.2. Behavior specific to HTML in compositing-1, I'm less sure that there's even a meaningful difference between stacking context and grouping property, or, if so, what it would be. (And I added another column to my big test, and retitled one of the existing columns.)

z-index creates a stacking context, but isn't a grouping property for preserve-3d. transform itself sort of is too, but that's part of the spec in question, so less interesting.

I agree with @smfr that overflow:clip should cause flattening in 3D transforms, and I think I'm also inclined to agree with his preference that it not create a stacking context (although my opinion there is much weaker).

We'd get better performance if the most common clip was a stacking context where we could clip all the descendants as a single group. Ideally it'd be a containing block too, but that might be hard to add.

Maybe we want to just add it to the list of flattening conditions without describing it as a grouping property?

We already have this confusion with overflow:hidden. Maybe we should just call the set flattening conditions rather than grouping properties?

smfr commented 3 years ago

overflow:hidden is already a grouping property

In my mind grouping properties have to create stacking context, and overflow:hidden does not (probably an early CSS mistake), so I think any spec language has to special-case overflow impacts on preserve-3d.