[csswg-drafts] [css-align-3] What is supposed to happen to abspos in an end-aligned scroll container? (#4957)

tabatkins has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-align-3] What is supposed to happen to abspos in an end-aligned scroll container? ==
Consider this scenario:

```
<container style="display:block; height:100px; overflow:auto; position:relative;">
  <child style="height:200px;"></child>
  <abspos style="position:absolute; left:0; top:0; height:500px;"></abspos>
</container>
```

Layout's well-defined so far. Scrollable overflow area is 500px tall, initial scroll position is 0, etc.

Now set "align-content: end;" on the container.

The rules in the spec say that, since the container is a scroll container, you do *not* move the alignment subject at all. Instead, you adjust the initial scroll position of the scroll container *such that* the alignment subject is aligned *relative to the scrollport* the same that it would be aligned relative to the container if it weren't scrollable. The container is thus scrolled 100px down, so the bottom of the child is aligned with the bottom of the scrollport.

In other words, if you toggle 'overflow' on and off, the content should sit perfectly still, while remaining fully accessible in the scrollable case (that is, never getting shifted into the unscrollable area).

And this goal is achieved! For the in-flow content, at least.  It does *not* work for the abspos. Because the abspos is positioned relative to the scrollable overflow area, it jumps as you toggle overflow on and off, and the container is either scrolled or not.  This violates the original design goal.

I only see one possible fix: Abspos descendants are shifted by content alignment, so they maintain the same positioning relative to the alignment subject. (Increasing the scrollable overflow area, but I think never pushing anything into the unscrollable zone.)

Alternately, we can just ignore it, and accept that the original design goal only applies to in-flow content, and the relative positioning of in-flow and abspos content can change depending on 'overflow'.

Thoughts?

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4957 using your GitHub account

Received on Thursday, 16 April 2020 00:45:56 UTC