Re: [csswg-drafts] [css-sizing-4] Should aspect-ratio affect the intrinsic size? (#5032)

So there are two different potential models `min-content`, and `max-content` sizes, currently both definitions resolve to the same thing (I believe) but will different when considering aspect ratio.
1) An element with `width: min-content` is the same size the element under a min-content constraint.
2) The *value* of `min-content` is the same size as the element under a min-content constraint.

```html
<!-- Case A -->
<div style="height: 100px; aspect-ratio: 1 / 1; width: max-content;">
  <div style="display: inline-block; width: 150px;"></div>
  <div style="display: inline-block; width: 150px;"></div>
</div>

<!-- Case B -->
<div style="height: 100px; aspect-ratio: 1 / 1; width: max-content; min-width: 0;">
  <div style="display: inline-block; width: 150px;"></div>
  <div style="display: inline-block; width: 150px;"></div>
</div>

<!-- Case C -->
<div style="height: 100px; aspect-ratio: 1 / 1; min-width: max-content;">
  <div style="display: inline-block; width: 150px;"></div>
  <div style="display: inline-block; width: 150px;"></div>
</div>

<!-- Case D -->
<div style="height: 100px; aspect-ratio: 1 / 1; min-width: max-content;">
  <div style="display: inline-block; width: 75px;"></div>
</div>
```

### Option 1 ###
`min-content` and `max-content` just consider the aspect-ratio (not their children) in this case.

For this to work the current definition of the [aspect-ratio-minimum](https://drafts.csswg.org/css-sizing-4/#aspect-ratio-minimum) is incorrect it likely wants to refer to the `min-intrinsic` size instead (described above).

Things like flexbox etc, will also potentially need to refer to the `min-intrinsic` size instead? E.g. [here](https://drafts.csswg.org/css-flexbox-1/#content-size-suggestion)?

| | `max-content` | `width` | `min-width` | final size |
|-|-|-|-|-|
| Case A | `100px` | `100px` | `150px` | `150px` |
| Case B | `100px` | `100px` | `0px` | `100px` |
| Case C | `100px` | `100px` | `100px` | `100px` |
| Case D | `100px` | `100px` | `75px` | `100px` |

### Option 2 ###
`min-content` and `max-content` consider both the aspect-ratio *and* their children if the aspect-ratio-minimum applies.

E.g. if there is an aspect-ratio present, the `min-content`, and `max-content` sizes are the resolved size from the aspect-ratio, then apply the content sizes.

| | `max-content` | `width` | `min-width` | final size |
|-|-|-|-|-|
| Case A | `300px` | `300px` | `150px` | `300px` |
| Case B | `300px` | `300px` | `0px` | `300px` |
| Case C | `300px` | `100px` | `300px` | `300px` |
| Case D | `75px` | `100px` | `75px` | `100px` |

The aspect-ratio-minimum can still use the min-content definition here, (and likely other places like flex?)

(I might update this in the morning, some things might be wrong).



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

Received on Tuesday, 16 June 2020 03:59:16 UTC