Re: [csswg-drafts] [css-flexbox-1][css-position-3] static position of abspos flex children (#5843)

@fantasai, question about this case:

```html
<div style="display: flex; flex-flow: column; justify-content: end; width: 100px; height: 100px;">
  <div style="position: absolute; justify-self: end; align-self: start; inset-inline: 5px; width: 50px; height: 50px; "></div>
</div>
```

According to the [first set of conditions](https://github.com/w3c/csswg-drafts/issues/5843#issuecomment-880999145) (the "swap axis" conditions), this counts as a change in behavior, but I don't think this case would actually change under the proposal.

Applying the "swap axis" conditions to this case:

>   * The flex container in question is a column flex container.

Check.
>   * The `align-self` and `justify-self` map to different values in an absolute sense.

`start` and `end` are different. Check.

>   * The abspos child has both insets in an axis set to `auto` (and is therefore statically positioned).

Yep, block axis insets are `auto`. Check.

>   * The static positioning rectangle is not equal in size to the abspos item’s margin box in that axis (thus the alignment properties can have an effect in this axis).

50x50 and 100x100 are different. Check.

I think check 3 and check 4 need to be scoped to the **cross** axis, not **an** axis. Because the proposal only changes behavior for _cross-axis_ positioning, I think, because this part of the proposal matches what engines already do today, right?

> In the main axis, the start and end margin edges of the child if it were the sole flex item in the container. [this will lock us to the position defined by justify-content on the flex container]

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


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Sunday, 8 May 2022 02:10:49 UTC