Re: [csswg-drafts] [css-grid] Resolving percentage heights of grid items during min-content sizing

> @fantasai that statement makes no sense. Base sizes are the result from the Track Sizing Algorithm - they can't be "auto". They are always a definite size. I'm assuming you mean "the block-size of the grid item after it is flowed in a containing block (CB) that has an inline size of 200px". So, I assume you mean "0 ~200px 0".

@MatsPalmgren Yes, that's what I meant.

> Also, I don't understand why you think the base size should be zero in the third test. You are correct that Automatic Minimum Size doesn't apply, but that doesn't make the min-content contribution zero

Right, but we're not looking at the min-content contribution when we're calculating the base size. `1fr` expands to `minmax(auto, 1fr)`, not `minmax(min-content, 1fr)`. The grid container is not being sized under a min/max-content constraint--it's explicitly sized at 300px. So the `auto` minimum is supposed to mean “use the automatic minimum size”, which due to the `overflow` setting is zero in this case. https://www.w3.org/TR/2017/CR-css-grid-1-20171214/#algo-single-span-items It seems that this is working fine in browsers when calculating columns, it's just not happening for rows. (Note the ED has some half-baked edits on this section, so linking to the CR.)

The point of `auto` is to add some automagic to the minimum (primarily to account for `overflow`), so that it is not always the min-content size--if we simply used the min-content size here always, we'd be defeating the point.

@FremyCompany Yes, in those first two cases, your flex container has an auto height, so it first calculates the container size from the max-content contribution of the items, then it resolves the percentage against that. In this case, the max-content contribution of the image is larger than the text, and is controlling the size of the container. Resolving 100% against that means the image simply is the size it is.

In the third case, the float's size is resolved as clamp(min-content, CB, max-content). The min-content size of the image is zero, the max-content is 32px, and CB is 9px, so we get 9px for the float, and the image's 100% width resolves against that.

In the last case, the percentage is attempting to resolve against an indefinite size (because while the max-height is definite, the height is not). And such percentages do not resolve; the percentage height is thrown out and treated as the initial value, `auto`. Meanwhile the width resolves against the float's width, which is clamp(min-content, CB, max-content) = max-content of the image = 32px.

-- 
GitHub Notification of comment by fantasai
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2674#issuecomment-390366891 using your GitHub account

Received on Saturday, 19 May 2018 01:00:48 UTC