8000 [css-scroll-snap] Rename scroll-snap-margin to scroll-margin per WG r… · w3c/csswg-drafts@0b1ff98 · GitHub
Skip to content

Commit 0b1ff98

Browse files
fantasaifantasai
committed
[css-scroll-snap] Rename scroll-snap-margin to scroll-margin per WG resolution.
1 parent 3754463 commit 0b1ff98

2 files changed

Lines changed: 27 additions & 23 deletions

File tree

‎css-scroll-snap-1/Overview.bs‎

Lines changed: 25 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -212,7 +212,7 @@ Overview {#overview}
212212
<a>Snap positions</a> are specified
213213
as a particular alignment ('scroll-snap-align')
214214
of an element’s <a>scroll snap area</a>
215-
(its border bounding box, as modified by 'scroll-snap-margin')
215+
(its border bounding box, as modified by 'scroll-margin')
216216
within the <a>scroll container</a>’s <a>snapport</a>
217217
(its scrollport, as reduced by 'scroll-padding').
218218
This is conceptually equivalent to specifying the alignment of
@@ -484,11 +484,11 @@ Aligning Scroll Snap Areas: Properties on the elements {#properties-on-the-elem
484484
██ ██ ██ ██ ████████ ██ ██
485485
-->
486486

487-
Scroll Snapping Area: the 'scroll-snap-margin' property {#scroll-snap-margin}
488-
-----------------------------------------------------------------------------
487+
Scroll Snapping Area: the 'scroll-margin' property {#scroll-margin}
488+
-------------------------------------------------------------------
489489

490490
<pre class="propdef">
491-
Name: scroll-snap-margin
491+
Name: scroll-margin
492492
Value: <<length>>{1,4}
493493
Initial: 0
494494
Applies to: all elements
@@ -500,7 +500,7 @@ Scroll Snapping Area: the 'scroll-snap-margin' property {#scroll-snap-margin}
500500
</pre>
501501

502502
This property is a <a>shorthand property</a> that sets
503-
all of the <a href="#longhands"><css>scroll-snap-margin-*</css> longhands</a>
503+
all of the <a href="#longhands"><css>scroll-margin-*</css> longhands</a>
504504
in one declaration,
505505
assigning values to the longhands representing each side
506506
exactly as the 'margin' property does for its longhands.
@@ -1008,11 +1008,11 @@ Flow-relative Longhands for 'scroll-padding' {#padding-longhands-logical}
10081008
If two values are specified, the first gives the start value
10091009
and the second gives the end value.
10101010

1011-
Physical Longhands for 'scroll-snap-margin' {#margin-longhands-physical}
1012-
-------------------------------------------------------------------------
1011+
Physical Longhands for 'scroll-margin' {#margin-longhands-physical}
1012+
--------------------------------------------------------------------
10131013

10141014
<pre class="propdef">
1015-
Name: scroll-snap-margin-top, scroll-snap-margin-right, scroll-snap-margin-bottom, scroll-snap-margin-left
1015+
Name: scroll-margin-top, scroll-margin-right, scroll-margin-bottom, scroll-margin-left
10161016
Value: <<length>>
10171017
Initial: 0
10181018
Applies to: all elements
@@ -1023,15 +1023,15 @@ Physical Longhands for 'scroll-snap-margin' {#margin-longhands-physical}
10231023
Animatable: as length
10241024
</pre>
10251025

1026-
These <a>longhands</a> of 'scroll-snap-margin' specify
1026+
These <a>longhands</a> of 'scroll-margin' specify
10271027
the top, right, bottom, and left edges
10281028
of the <a>scroll snap area</a>, respectively.
10291029

1030-
Flow-relative Longhands for 'scroll-snap-margin' {#margin-longhands-logical}
1031-
-----------------------------------------------------------------------------
1030+
Flow-relative Longhands for 'scroll-margin' {#margin-longhands-logical}
1031+
------------------------------------------------------------------------
10321032

10331033
<pre class="propdef">
1034-
Name: scroll-snap-margin-block-start, scroll-snap-margin-inline-start, scroll-snap-margin-block-end, scroll-snap-margin-inline-end
1034+
Name: scroll-margin-block-start, scroll-margin-inline-start, scroll-margin-block-end, scroll-margin-inline-end
10351035
Value: <<length>>
10361036
Initial: 0
10371037
Applies to: all elements
@@ -1042,12 +1042,12 @@ Flow-relative Longhands for 'scroll-snap-margin' {#margin-longhands-logical}
10421042
Animatable: as length
10431043
</pre>
10441044

1045-
These <a>longhands</a> of 'scroll-snap-margin' specify the
1045+
These <a>longhands</a> of 'scroll-margin' specify the
10461046
block-start, inline-start, block-end, and inline-end edges
10471047
of the <a>scroll snap area</a>, respectively.
10481048

10491049
<pre class="propdef">
1050-
Name: scroll-snap-margin-block, scroll-snap-margin-inline
1050+
Name: scroll-margin-block, scroll-margin-inline
10511051
Value: <<length>>{1,2}
10521052
Initial: 0
10531053
Applies to: all elements
@@ -1058,9 +1058,9 @@ Flow-relative Longhands for 'scroll-snap-margin' {#margin-longhands-logical}
10581058
Animatable: as length
10591059
</pre>
10601060

1061-
These <a>shorthands</a> of 'scroll-snap-margin-block-start' + 'scroll-snap-margin-block-end'
1062-
and 'scroll-snap-margin-inline-start' + 'scroll-snap-margin-inline-end'
1063-
are <a>longhands</a> of 'scroll-snap-margin',
1061+
These <a>shorthands</a> of 'scroll-margin-block-start' + 'scroll-margin-block-end'
1062+
and 'scroll-margin-inline-start' + 'scroll-margin-inline-end'
1063+
are <a>longhands</a> of 'scroll-margin',
10641064
and specify the block-axis and inline-axis edges
10651065
of the <a>scroll snap area</a>, respectively.
10661066

@@ -1097,10 +1097,13 @@ Changes Since 24 August 2017 CR {#changes-20170824}
10971097

10981098
Changes since the <a href="https://www.w3.org/TR/2017/CR-css-scroll-snap-1-20170824/">24 August 2017 Candidate Recommendation</a> include:
10991099

1100-
* '':target''/{{scrollIntoView()}}/etc must use snap positions if snapping is turned on,
1101-
and may use them even if it's off.
1102-
* '':target''/{{scrollIntoView()}}/etc should take 'scroll-snap-margin' into account,
1103-
regardless of whether snapping is turned on or not.
1100+
* '':target''/{{scrollIntoView()}}/etc should take 'scroll-margin' into account,
1101+
regardless of whether snapping is turned on or not.
1102+
* '':target''/{{scrollIntoView()}}/etc must (rather than should)
1103+
use snap positions if snapping is turned on.
1104+
* Renamed <css>scroll-snap-margin</css> to 'scroll-margin'
1105+
to reflect its more generic role in providing breathing space
1106+
for scrolling to an element regardless of snapping behavior.
11041107

11051108
Changes Since 20 October 2016 CR {#changes-20161020}
11061109
----------------------------------------------------
@@ -1126,7 +1129,7 @@ Changes Since 20 October 2016 CR {#changes-20161020}
11261129
may push off-screen the [=snap area=] that the other axis would otherwise align to,
11271130
making its [=snap position=] invalid and therefore unchooseable.</p></ins>
11281131
</blockquote>
1129-
<li>Clarified how the 'scroll-padding' and 'scroll-snap-margin' shorthands
1132+
<li>Clarified how the 'scroll-padding' and 'scroll-margin' shorthands
11301133
assign values to their longhands.
11311134
(<a href="https://github.com/w3c/csswg-drafts/issues/1050">Issue 1050</a>)
11321135
<li>Clarified that scroll snapping does not mandate any particular input method.

‎css-scroll-snap-1/issues-cr-2016-08.bsi‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,5 +33,6 @@ Issue 4.
3333
Summary: Rename scroll-snap-margin to scroll-margin?
3434
From: Alan Stearns
3535
Comment: https://github.com/w3c/csswg-drafts/issues/1954
36-
Open: =WG= Discuss.
36+
Closed: Accepted
37+
Resolved: Telecon 2017-12-06
3738
----

0 commit comments

Comments
 (0)