w3c / csswg-drafts

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

[css-images-4] object-view-box interaction with contain-intrinsic-size #7187

Open vmpstr opened 2 years ago

vmpstr commented 2 years ago

object-view-box property says that

When the element is painted, its contents are scaled and translated such that the element’s contents retain the same position and size, relative to the view box’s final size and position, that they had when the view box was determined (above).

My interpretation of this is that we use the element's natural size in conjunction with the viewbox size to do some math and figure out new positions and sizes. My question is what happens if the element has size containment and a specified contain-intrinsic-size, which says that

These properties allow elements with size containment to specify an explicit intrinsic inner size, causing the box to size as if its in-flow content totals to a width and height matching the specified explicit intrinsic inner size (rather than sizing as if it were empty).

So should the math that we do use the original element content size (say original image's natural dimensions), or should it use the contain-intrinsic-size "overrides". And in general, should size-containment and contain-intrinsic-size apply before the object-view-box property? I think that if there is size containment with no contain-intrinsic-size then we would ignore the object-view-box property because it would have 0 intrinsic dimensions. Should be ignore the viewbox even if there is contain-intrinsic-size or is it a matter of which sizes we use for computing the painted output dimensions/positions

I'm not sure if there is a important distinction between "natural" sizes and "intrinsic" sizes that should be called out.

/cc @khushalsagar @tabatkins

tabatkins commented 2 years ago

contain-intrinsic-size should have no direct interaction with this object-view-box; the two are operating on different concepts and at different "times", so they'll each just do their own thing.

In particular, c-i-s sets the "explicit intrinsic inner size", which is a term of art defined to have an effect on how a contain:paint element is sized (it overrides the results of calculating the size of the element's content); this is unrelated to the natural sizes of a replaced element, which are derived directly from the image/etc.

o-v-b just changes how the image content itself reports its natural sizes and paints itself relative to those natural-size bounds; layout of the image into whatever layout-based sizes you get happen after that. As far as all of layout is concerned, you've just loaded an image whose natural dimensions are now what o-v-b reports, and which might paint slightly oddly (outside the bounds of those natural sizes); in all other respects it's identical to how the image would have originally worked without o-v-b.

The fact that these questions are coming up at all, tho, indicates that I almost certainly do need to go ahead and define some more terms to make this layering more explicit; I was trying to avoid that.

khushalsagar commented 2 years ago

@tabatkins, IIUC your comment correctly contain-intrinsic-size should only be an input to the layout of the replaced element. This is the order of operations done during layout :

Once the element has been sized, the object-fit and object-position properties used to paint the element work on the natural size of the element's content (which may have been updated using object-view-box). At paint time, contain-intrinsic-size has no effect. Does that sound right?

tabatkins commented 2 years ago

Correct.