From c2fa93089b2251e72973ded1fa042ef4207dfa34 Mon Sep 17 00:00:00 2001 From: Andreu Botella Date: Mon, 2 Sep 2024 13:57:00 +0200 Subject: [PATCH 1/3] [css-overflow-4] Draft spec for `continue: collapse` (#7708) --- css-overflow-4/Overview.bs | 119 ++++++++++++++++++++++++++++--------- 1 file changed, 91 insertions(+), 28 deletions(-) diff --git a/css-overflow-4/Overview.bs b/css-overflow-4/Overview.bs index 6dc3db0d26c..3f828d3ac9b 100644 --- a/css-overflow-4/Overview.bs +++ b/css-overflow-4/Overview.bs @@ -707,12 +707,15 @@ Indicating Block-Axis Overflow: the 'block-ellipsis' property This property allows inserting content into the last line box - before a (forced or unforced) region break - to indicate the continuity of truncated/interrupted content. + before a (forced or unforced) region break or a [=clamp point=] + to indicate the continuity of truncated / interrupted content. It only affects line boxes contained directly by the block container itself, but as it inherits, will have an effect on descendants’ line boxes unless overridden. - If the box contains no line box immediately preceding a region break, - then this property has no effect. + + This property only affects a line box if there is eiher a [=region break=] or a [=clamp point=] + after it in the [=block formatting context=], and there are no boxes or line boxes in between. + If the [=clamp point=] is placed at the end of the [=line-clamp container=], then the line will + not be affected. Note: See [[css-overflow-4#fragmentation]] for a way to generate boxes with such a [=region break=]. @@ -777,10 +780,12 @@ Indicating Block-Axis Overflow: the 'block-ellipsis' property The [=block overflow ellipsis=] must not be included in either the ''::first-letter'' nor the ''::first-line'' pseudo-elements. - If there is a subsequent fragmentation container in the [=fragmentation context=] + If the [=block overflow ellipsis=] is placed before a [=region break=] and + there is a subsequent fragmentation container in the [=fragmentation context=] that would receive subsequent content, then the content displaced by the block overflow ellipsis - must be pushed to that fragmentation container. + must be pushed to that fragmentation container. If it is placed before a [=clamp point=], + then the displaced content must be pushed to the remainder of the [=inline formatting context=]. The UA must treat the block overflow ellipsis as an unbreakable string, If any part of the [=block overflow ellipsis=] overflows, @@ -844,7 +849,7 @@ Limiting Visible Lines: the 'line-clamp' shorthand property
<>
<'block-ellipsis'>
- Sets 'continue' to ''discard'' + Sets 'continue' to ''collapse'' if either or both values ares specified. Sets 'max-lines' to the specified <> @@ -901,7 +906,7 @@ Legacy compatibility For compatibility with legacy content, UAs that support 'line-clamp' must also support the '-webkit-line-clamp' property - and the additional ''-webkit-discard'' value for the 'continue' property. + and the additional ''-webkit-collapse'' value for the 'continue' property.
 		Name: -webkit-line-clamp
@@ -912,17 +917,17 @@ Legacy compatibility
 
 	
 		Name: continue
-		New Values: -webkit-discard
+		New Values: -webkit-collapse
 	
Like 'line-clamp', '-webkit-line-clamp' is a shorthand of 'max-lines', 'continue', and 'block-ellipsis', except that: * its syntax is ''line-clamp/none'' | <> - * it sets 'continue' to ''-webkit-discard'' instead of ''discard'' + * it sets 'continue' to ''-webkit-collapse'' instead of ''collapse'' * it unconditionally sets 'block-ellipsis' to ''block-ellipsis/auto'' - The -webkit-discard value behaves identically to ''discard'', + The -webkit-collapse value behaves identically to ''collapse'', except that it only takes effect if the [=specified value=] of the 'display' property is ''-webkit-box'' or ''-webkit-inline-box'' @@ -947,28 +952,33 @@ Forcing a Break After a Set Number of Lines: the 'max-lines' property Name: max-lines Value: ''none'' | <> Initial: ''none'' - Applies to: block containers which are also [=fragmentation containers=] that capture [=region breaks=] + Applies to: block containers which are also either [=fragmentation containers=] that capture [=region breaks=] or [=line-clamp containers=] Inherited: no Percentages: N/A Computed value: the keyword ''max-lines/none'' or an integer Animation type: by computed value type
- This property only has an effect on boxes that are [=fragmentation containers=] that capture [=region breaks=]. + If the value of 'max-lines' is not none, then, where + N is the computed value of 'max-lines': + + - If the box is a [=fragmentation container=] that captures [=region breaks=], + a region break or + is forced after its Nth + descendant in-flow line box. + If fewer than N line boxes exist, + then 'max-lines' introduces no region break. + - If the box is a [=line-clamp container=], its [=clamp point=] is set after its Nth + descendant in-flow line box. + If fewer than N line boxes exist, then the clamp point is set to the end of the + line-clamp container. - Also, if the value of 'max-lines' is not none, - a region break - is forced after its Nth - descendant in-flow line box, - where N is the specified value of 'max-lines'. - Only lines boxes in the same Block Formatting Context + + Only line boxes in the same Block Formatting Context are counted: the contents of descendants that establish independent formatting contexts are skipped over while counting line boxes. - If fewer than N line boxes exist, - then 'max-lines' introduces no region break. - Note: This implies that 'max-lines' has no effect when applied to [=multi-column containers=], since any line box they contain are nested into [=independent formatting contexts=]. @@ -1004,7 +1014,7 @@ Fragmentation of Overflow: the 'continue' property
 		Name: continue
-		Value: auto | discard
+		Value: auto | discard | collapse
 		Initial: ''continue/auto''
 		Applies to: [=block containers=] and [=multicol containers=]
 		Inherited: no
@@ -1014,10 +1024,11 @@ Fragmentation of Overflow: the 'continue' property
 	
The 'continue' property gives authors the ability - to turn a box into a [=fragmentation container=] (see [[!CSS-BREAK-3]]) - and to specify that content after the [=fragmentation break=] must be discarded. + to truncate/interrupt the content inside a box, by either visually hiding + the remaining content, or by turning the box into a [=fragmentation container=] (see [[!CSS-BREAK-3]]) + and discarding the content after the [=fragmentation break=]. - Issue: This property is meant to generalize and replace the region-fragment property from [[CSS-REGIONS-1]]. + Issue: ''continue: discard'' is meant to generalize and replace the region-fragment property from [[CSS-REGIONS-1]]. Once it is sufficiently stable in this specification, region-fragment should be removed from the regions specification in favor of this. @@ -1048,6 +1059,15 @@ Fragmentation of Overflow: the 'continue' property Breaks applying to other [=fragmentation contexts=] (such as pagination of this box itself) do not cause any content to be discarded. + +
collapse +
+ If the box is a [=block container=], then it must + [=establish an independent formatting context=] that also becomes a [=line-clamp container=]. + This causes all content after the [=clamp point=] to be visually hidden, and to not be + taken into account for the box's [=automatic block size=]. + + This keyword has no effect on [=multicol containers=].
@@ -1115,6 +1135,9 @@ Fragmentation of Overflow: the 'continue' property would cause intrinsic sizes to depend on layout, which would cause circularities. --> + Note: This differs from the ''visibility: hidden''-like behavior of content after the [=clamp + point=] with ''continue: collapse''. + Note: In the case of parallel fragmentation flows, content occurring after the fragmentation break in the box tree could still be rendered, @@ -1123,12 +1146,12 @@ Fragmentation of Overflow: the 'continue' property Additionaliy, for compatibility (see [[#webkit-line-clamp]]), - when the [=computed value=] of the 'continue' property is ''discard'' + when the [=computed value=] of the 'continue' property is ''collapse'' or ''-webkit-collapse'' and the [=computed value=] of the '-webkit-box-orient' property is ''vertical'': * If the [=specified value=] of the 'display' property is ''-webkit-box'', the [=computed value=] becomes ''flow-root'' and the box establishes a [=BFC=]. - * If the [=specified value=] of the 'display property is ''-webkit-inline-box'', + * If the [=specified value=] of the 'display' property is ''-webkit-inline-box'', the [=computed value=] becomes ''inline-block'' and the box establishes a [=BFC=]. @@ -1140,6 +1163,46 @@ Fragmentation of Overflow: the 'continue' property as the box would be a [=flex container=] rather than a [=block container=], and thus the 'continue' property would not apply. +

Line-clamp containers

+ + A line-clamp container is an [=independent formatting context|independent=] [=block formatting context=] that + additionally follows the rules in this section. All line-clamp containers contain a + clamp point, which is one of the following positions inside it: + + - The start of the line-clamp container. + - A point between two [=in-flow=] sibling boxes in the line-clamp + container's [=block formatting context=]. + - A point between two [=line boxes=] in an in-flow [=inline formatting + context=] inside the line-clamp container's [=block formatting context=]. + - The end of the line-clamp container. + + Note: The [=clamp point=] can never be before a parent box's first child, or + after a parent box's last child, unless that parent box is the line-clamp + container. Similarly, the clamp point can never be before the first line or + after the first line of an [=inline formatting context=]. It can also never + be in [=out-of-flow=] content, or inside an [=independent formatting + context=]. + + If the [=line-clamp container=]'s [=block formatting context root=] has a [=computed value=] of + 'max-lines' other than ''max-lines/none'', then that property will determine the [=clamp point=]. + Otherwise, the clamp point will be set to the last possible clamp point such that, for it and + all previous possible clamp points, the line-clamp container's [=automatic block size=] (as + determined below) is not greater than the [=block size=] the box would have if its automatic + block size were infinite. + + Any boxes in a [=line-clamp container=] that follow its [=clamp point=] in the box tree, as well + as any [=line boxes=] that follow it inside an [=inline formatting context=], will be invisible + (behaving like ''visibility: hidden''). This includes [=independent formatting contexts=] as + well as [=out-of-flow=] boxes, and all of their descendants. Any overflow such boxes and line + boxes might have is always counted as [=ink overflow=] rather than [=scrollable overflow=]. + + NOTE: This differs from the ''display: none''-like behavior of not rendered content with + ''continue: discard''. + + If a [=block container=] contains a [=clamp point=], within itself or in any of its descendants, + its [=automatic block size=] will not take into account any of its children after the clamp point. + This also applies for the [=line-clamp container=] itself. +

Appendix A: Possible extensions for ''scrollbar-gutter''

From c7df9c98f80dca9cae99369a8f30162928f6e50e Mon Sep 17 00:00:00 2001 From: Andreu Botella Date: Sun, 15 Sep 2024 01:25:50 +0200 Subject: [PATCH 2/3] Clarification about float clearance in the automatic block size --- css-overflow-4/Overview.bs | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/css-overflow-4/Overview.bs b/css-overflow-4/Overview.bs index 3f828d3ac9b..c322df1d40c 100644 --- a/css-overflow-4/Overview.bs +++ b/css-overflow-4/Overview.bs @@ -1203,6 +1203,12 @@ Fragmentation of Overflow: the 'continue' property its [=automatic block size=] will not take into account any of its children after the clamp point. This also applies for the [=line-clamp container=] itself. + NOTE: If there are any floats before the [=clamp point=], the [=line-clamp container=]'s + automatic size must grow to encompass the clearance, just like it would if it were a regular + [=block formatting context=] root that only contained its contents before the [=clamp point=]. + This is regardless of whether this would cause any content after the [=clamp point=] to be + within the container's bounds. +

Appendix A: Possible extensions for ''scrollbar-gutter''

From 1699d89b19296b9715e79d5092f4e41ab30ee35c Mon Sep 17 00:00:00 2001 From: Andreu Botella Date: Fri, 4 Oct 2024 08:36:34 +0900 Subject: [PATCH 3/3] Update to only allow clamping after a line --- css-overflow-4/Overview.bs | 24 ++++++++---------------- 1 file changed, 8 insertions(+), 16 deletions(-) diff --git a/css-overflow-4/Overview.bs b/css-overflow-4/Overview.bs index c322df1d40c..56013f5f97d 100644 --- a/css-overflow-4/Overview.bs +++ b/css-overflow-4/Overview.bs @@ -712,8 +712,8 @@ Indicating Block-Axis Overflow: the 'block-ellipsis' property It only affects line boxes contained directly by the block container itself, but as it inherits, will have an effect on descendants’ line boxes unless overridden. - This property only affects a line box if there is eiher a [=region break=] or a [=clamp point=] - after it in the [=block formatting context=], and there are no boxes or line boxes in between. + This property only affects a line box if it immediately precedes + eiher a [=region break=] or a [=clamp point=] in the [=block formatting context=]. If the [=clamp point=] is placed at the end of the [=line-clamp container=], then the line will not be affected. @@ -1169,26 +1169,18 @@ Fragmentation of Overflow: the 'continue' property additionally follows the rules in this section. All line-clamp containers contain a clamp point, which is one of the following positions inside it: - - The start of the line-clamp container. - - A point between two [=in-flow=] sibling boxes in the line-clamp - container's [=block formatting context=]. - - A point between two [=line boxes=] in an in-flow [=inline formatting - context=] inside the line-clamp container's [=block formatting context=]. - - The end of the line-clamp container. - - Note: The [=clamp point=] can never be before a parent box's first child, or - after a parent box's last child, unless that parent box is the line-clamp - container. Similarly, the clamp point can never be before the first line or - after the first line of an [=inline formatting context=]. It can also never - be in [=out-of-flow=] content, or inside an [=independent formatting - context=]. + - A point immediately after a [=line box=] in the line-clamp container's [=block formatting + context=]. + - The end of the line-clamp container, if there are any boxes after the last [=inline formatting + context=] in the line-clamp container's [=block formatting context=]. If the [=line-clamp container=]'s [=block formatting context root=] has a [=computed value=] of 'max-lines' other than ''max-lines/none'', then that property will determine the [=clamp point=]. Otherwise, the clamp point will be set to the last possible clamp point such that, for it and all previous possible clamp points, the line-clamp container's [=automatic block size=] (as determined below) is not greater than the [=block size=] the box would have if its automatic - block size were infinite. + block size were infinite; or if that is not the case for any clamp points, to the first clamp + point in the block formatting context. Any boxes in a [=line-clamp container=] that follow its [=clamp point=] in the box tree, as well as any [=line boxes=] that follow it inside an [=inline formatting context=], will be invisible