diff --git a/css-align-3/Overview.bs b/css-align-3/Overview.bs index ac4b67e61ae..0b19aa4c7a9 100644 --- a/css-align-3/Overview.bs +++ b/css-align-3/Overview.bs @@ -897,7 +897,7 @@ Content Distribution for Scroll Containers
Self-Alignment for Absolutely Positioned Boxes
- For [=absolutely positioned=] [=alignment subjects=] + For [=absolutely positioned=] [=alignment subjects=] whose relevant [=self-alignment property=] is not ''justify-self/normal'', the default [=overflow alignment=] behavior is as follows: @@ -1171,30 +1171,24 @@ Content-Distribution Shorthand: the 'place-content' property in which case it is defaulted to ''start''.

-Overflow and Scroll Positions

+Alignment Overflow and Scroll Containers When the content-distribution properties are set on a scroll container with an overflowing alignment subject, - rather than shifting the layout positions of its content, - they instead change its initial scroll position - so that the initially-visible content - of the scroll container - satisfies the [[#alignment-values|expected alignment]] - of the alignment subject and alignment container. - However, the [[css-scroll-snap-2#scroll-initial-target-with-place-content|scroll-initial-target]] - property, when present, overrides the content-distribution properties - in determining the initial scroll position. - - Note: The presence of scrollbars can change the size of the [=scroll container’s=] content box, - and thus the size of the [=alignment container=] - and/or [=alignment subject=]. + they reduce the clipping of the [=negative scrollable overflow region=] + just enough to ensure that alignment subject can be scrolled + into its ''align-content/start''-aligned position.
For example, if a scrollable flex container is set to ''justify-content: flex-end'' (or ''justify-content: flex-start'' with ''flex-flow: row-reverse''), - it will be initially displayed scrolled all the way to the main-end edge of its content, + its [=in-flow=] content will be initially positioned + to align the main-end edge of its content to the main-end edge of the flex container, and its content will appear to overflow its main-start edge. + However, the viewer will be able to scroll up + to view the overflowing [=in-flow=] content, + just as if ''justify-content: flex-start'' had been specified.
@@ -1204,17 +1198,16 @@ Overflow and Scroll Positions
- None of this changes how scroll coordinates are assigned: - the origin is still where it would be in a ''align-content/start''-aligned container, - it just might be initially positioned outside the scrollport. - Note: The alignment subject is not necessarily identical to the scrollable overflow area: - content overflowing the alignment subject, - such as an absolutely-positioned or out-of-flow element, - grows the scrollable overflow area but not the alignment subject, - thus an ''align-content/end''-aligned scroll container - might not be initially scrolled all the way to the bottom. + content overflowing the alignment subject-- + such as an [=out-of-flow=] box-- + grows the scrollable overflow area but not the alignment subject. + Thus an ''align-content/end''-aligned scroll container + might not be initially scrolled all the way to the bottom, + and positioned content can still be clipped + if it is further into the [=negative scrollable overflow region=] + than the [=in-flow=] content forming the [=alignment subject=].
@@ -1226,6 +1219,10 @@ Overflow and Scroll Positions
+ Note: The presence of scrollbars can change + the size of the [=scroll container’s=] [=content box=]-- + and thus the size of the [=alignment container=] + and/or [=alignment subject=].

Baseline Content-Alignment

@@ -2523,6 +2520,9 @@ Changes Issue 9960)
  • Make all the ''space-*'' keywords fallback to ''safe'' overflow. (Issue 10154) +
  • Clearly define the interaction of overflowing [=content distribution=] and [=scroll containers=] + to not impact layout, but to only affect the extent of the [=scrollable overflow area=]. + (Issue 4957)
  • Only apply the special margin-edge baseline rule for [=scroll container=] [=block containers=] when 'baseline-source' is its [=initial value=]. (Issue 8214) diff --git a/css-overflow-3/Overview.bs b/css-overflow-3/Overview.bs index 50020a274c6..71d130fc3ef 100644 --- a/css-overflow-3/Overview.bs +++ b/css-overflow-3/Overview.bs @@ -225,7 +225,7 @@ Scrollable Overflow The border boxes of all boxes for which it is the containing block and whose border boxes are positioned not wholly - in the [=negative scrollable overflow region=], + in the [=unreachable scrollable overflow region=], accounting for transforms by projecting each box onto the plane of the element that establishes its 3D rendering context. [[!CSS3-TRANSFORMS]] @@ -265,15 +265,16 @@ Scrollable Overflow
  • Additional padding added - to the [=end=]-side of the [=scrollable overflow rectangle=] - as necessary to enable a scroll position - that satisfies the requirements of ''place-content: end'' alignment. + to the [=scrollable overflow rectangle=] + as necessary to enable scroll positions + that satisfy the requirements of both + ''place-content: start'' and ''place-content: end'' alignment. Note: This padding represents, within the [=scrollable overflow rectangle=], the box’s own padding - so that when its content is scrolled to the end, - there is padding between the end-edge of its in-flow (or floated) content + so that when its content is scrolled to its end, + there is padding between the edge of its in-flow (or floated) content and the border edge of the box. It typically ends up being exactly the same size as the box's own padding, except in a few cases-- @@ -293,9 +294,13 @@ Scrollable Overflow Additionally, due to Web-compatibility constraints (caused by authors exploiting legacy bugs to surreptitiously hide content from visual readers but not search engines and/or speech output), - UAs must clip any content in the [=negative scrollable overflow region=] - (thereby behaving as if they had no scrollable overflow - on the wrong side of the [=scroll origin=]). + UAs must clip any content in the [=unreachable scrollable overflow region=]. + + Note: The [=content-distribution properties=] can + [[css-align-3#overflow-scroll-position|alter the unreachable scrollable overflow region]] + to ensure that a [=scroll container=]’s [=alignment subject=] + is reachable after alignment. + [[CSS-ALIGN-3]]