diff --git a/css-align-3/Overview.bs b/css-align-3/Overview.bs index a5aad7925a1..4e6d80edbbd 100644 --- a/css-align-3/Overview.bs +++ b/css-align-3/Overview.bs @@ -1173,6 +1173,9 @@ Overflow and Scroll Positions of the scroll container satisfies the [[#alignment-values|expected alignment]] of the alignment subject and alignment container. + However, the [[css-scroll-snap-2#scroll-start-target-with-place-content|scroll-start-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=] diff --git a/css-overflow-3/Overview.bs b/css-overflow-3/Overview.bs index 0b4c8d91795..b01fcd48195 100644 --- a/css-overflow-3/Overview.bs +++ b/css-overflow-3/Overview.bs @@ -341,8 +341,8 @@ Scrolling Overflow is typically dependent on the [=scroll container=]’s [=writing mode=], and, unless otherwise specified, coincides with its [=scroll origin position=]. - However, the 'align-content' and 'justify-content' properties [[!CSS-ALIGN-3]] - can be used to change the [=initial scroll position=], + However, the 'align-content' and 'justify-content' properties [[!CSS-ALIGN-3]] as well as the + 'scroll-start-target' property [[!CSS-SCROLL-SNAP-2]] can be used to change the [=initial scroll position=], see [[css-align-3#overflow-scroll-position]]. A scroll position is a particular alignment diff --git a/css-scroll-snap-2/Overview.bs b/css-scroll-snap-2/Overview.bs index bbcd951db20..df518a01cba 100644 --- a/css-scroll-snap-2/Overview.bs +++ b/css-scroll-snap-2/Overview.bs @@ -58,13 +58,13 @@ First Layout {#first-layout} Motivating Examples {#examples} @@ -227,37 +227,87 @@ Interaction with RTL and LTR The 'scroll-start-target' property {#scroll-start-target} ------------------------------------------- +

+Initial scroll target

+ + The [=initial scroll target=] of a scroll container |scrollcontainer| + is an element or pseudo-element + whose 'scroll-start-target'property is non-''scroll-start-target/none'' + and whose nearest scroll container is |scrollcontainer|. + When multiple such elements or pseudo-elements exist, + user-agents should select the one + which comes first in [=tree order=]. + When no such element or pseudo-element exists, + |scrollcontainer|’s initial scroll target is null. + +
+ If the initial scroll target of a scroll container is not null, + it should be used to determine the initial scroll position of |scrollcontainer| + by running the following steps: + + 1. Let |target| be the initial scroll target for |scrollcontainer|. + 1. Let |position| be the result of running the steps to + determine the scroll-into-view position of |target| + with behavior set to "auto", + block set to "start", + inline set to "nearest", + and scrolling box set to |scrollcontainer|. + 1. Set |scrollcontainer|'s initial scroll position to |position|. +
+ + +

+The scroll-start-target shorthand

+
-	Name: scroll-start-target
-	Value: [ none | auto ]{1,2}
+		Name: scroll-start-target
+		Value: [ none | auto ]
+		Initial: ''none''
+		Applies to: all elements
+		Inherited: no
+		Percentages: N/A
+		Computed Value: see individual properties
+		Animation type: none
 	
- This property is a shorthand property that sets all of the scroll-start-target-* longhands in one declaration. - The first value defines the scroll starting point in the block axis, - the second sets it in the inline axis. - If the second value is omitted, it defaults to ''scroll-start-target/none''. - - Values are defined as follows: - -
+
none -
Element is not a ''scroll-start-target''. +
The element is not an [=initial scroll target=].
auto -
Element is used to calculate the 'scroll-start' position, - taking into account ''scroll-padding'' or ''scroll-margin'' , - same as a ''scroll-snap'' target. +
The element is potentially an [=initial scroll target=] + for its nearest [=scroll container=] ancestor.
+

+Interaction with 'place-content'

+ + If a [=scroll container's=] [=initial scroll position=] + is potentially set by both a [=content-distribution property=] + and by 'scroll-start-target' on a descendant, + 'scroll-start-target' wins. - Styling Snapped Items {#styling-snapped} @@ -300,13 +350,13 @@ Snap Events {#snap-events} {{scrollsnapchange}} and {{scrollsnapchanging}} {#scrollsnapchange-and-scrollsnapchanging} @@ -591,13 +641,13 @@ when the scrolling operation ends. Appendix A: Longhands {#longhands} @@ -638,39 +688,6 @@ Flow-relative Longhands for 'scroll-start' {#scroll-start-longhands-logical} Animation type: by computed value type - ... -Flow-relative Longhands for 'scroll-start-target' {#scroll-start-target-longhands-logical} --------------------------------------------------------------------------- - -
-	Name: scroll-start-target-block, scroll-start-target-inline
-	Value: auto | none
-	Initial: none
-	Applies to: all elements
-	Inherited: no
-	Logical property group: scroll-start-target
-	Percentages: n/a
-	Computed Value: either of the keywords "none" or "auto"
-	Animation type: not animatable
-	
- - ... - -Physical Longhands for 'scroll-start-target' {#scroll-start-target-longhands-physical} ----------------------------------------------------------------------- - -
-	Name: scroll-start-target-x, scroll-start-target-y
-	Value: none | auto
-	Initial: none
-	Applies to: all elements
-	Inherited: no
-	Logical property group: scroll-start-target
-	Percentages: n/a
-	Computed value: either of the keywords "none" or "auto"
-	Animation type: not animatable
-	
- ... Appendix B: Event Handlers {#event-handlers} diff --git a/cssom-view-1/Overview.bs b/cssom-view-1/Overview.bs index 6529ceee843..03ace12280b 100644 --- a/cssom-view-1/Overview.bs +++ b/cssom-view-1/Overview.bs @@ -1445,14 +1445,14 @@ The currentCSSZoom attribute must return the

{{Element}} Scrolling Members

-To scroll a target into view target, which is an Element or Range, + +To determine the scroll-into-view position of a target, which is an Element or Range, with a scroll behavior behavior, a block flow direction position block, -and an inline base direction position inline, -means to run these steps for each ancestor element or viewport that establishes -a scrolling box scrolling box, in order of innermost to outermost scrolling box: +an inline base direction position inline, +and a scrolling box scrolling box, +run the following steps: -1. If the {{Document}} associated with target is not same origin with the {{Document}} associated with the element or viewport associated with scrolling box, terminate these steps. 1. Let target bounding border box be the box represented by the return value of invoking Element's {{Element/getBoundingClientRect()}}, if target is an Element, or Range's {{Range/getBoundingClientRect()}}, if target is a Range. 1. Let scrolling box edge A be the beginning edge in the block flow direction of scrolling box, and let element edge A be target bounding border box's edge on the same physical side as that of scrolling box edge A. 1. Let scrolling box edge B be the ending edge in the block flow direction of scrolling box, and let element edge B be target bounding border box's edge on the same physical side as that of scrolling box edge B. @@ -1496,7 +1496,19 @@ a scrolling box scrolling box, in order of innermost to outerm
If element edge D is outside scrolling box edge D and element width is less than scrolling box width
Align element edge D with scrolling box edge D.
+ 1. Return position. + +To scroll a target into view target, which is an Element or Range, +with a scroll behavior behavior, +a block flow direction position block, +and an inline base direction position inline, +means to run these steps for each ancestor element or viewport that establishes +a scrolling box scrolling box, in order of innermost to outermost scrolling box: + +1. If the {{Document}} associated with target is not same origin with the {{Document}} associated with the element or viewport associated with scrolling box, terminate these steps. +1. Let position be the scroll position resulting from running the steps to determine the scroll-into-view position of target with behavior as the |scroll behavior|, + block as the |block flow position|, inline as the |inline base direction position| and scrolling box as the |scrolling box|. 1. If position is the same as scrolling box's current scroll position, and scrolling box does not have an ongoing smooth scroll, then return. 1.
If scrolling box is associated with an element