W3C home > Mailing lists > Public > public-css-archive@w3.org > January 2021

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

From: fantasai via GitHub <sysbot+gh@w3.org>
Date: Fri, 08 Jan 2021 22:02:19 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-757021088-1610143337-sysbot+gh@w3.org>
OK, so proposal: define the static position rectangle of a flex child as:
- 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]
- In the cross axis, we have a couple options:
  1. Use the start/end margin edges of the hypothetical flex item honoring align-content per Firefox.
  2. Use the start/end margin edges of the hypothetical flex item pretending flex container is single-line OR use the content-box edges of the container and define that statically-positioned abspos flex children specially map their align/justify-self axes per the container's flex flow instead of the abspos containing block writing mode. (Same effect, different definition methods.)
  3. Use the content-box edges of the container, allow alignment properties to work within resulting range as for other abspos.
The first option is consistent with Firefox and the Flexbox spec.
The second option is consistent with Chrome and WebKit.
The third option is consistent with Chrome and WebKit in the case of row flex containers, but differs in column flex containers in whether align-self or justify-self controls the alignment. However, it means align/justify-self axis mapping would be consistent across all abspos, instead of making a special exception for statically-positioned flex child abspos.

I think if we can do the third option, in the long run (once alignment is implemented for all abspos), it will be better for authors. But we need to consider the compat impact, and would need data for that.

CC @bfgeek @cbiesinger 

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

Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Friday, 8 January 2021 22:02:21 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:42:25 UTC