[css-overflow-4] Clarify when block-ellipsis affects a line box (#13525)

As per #12826, this patch clarifies and adds examples for when the
`block-ellipsis` property affects a line box.

This incorporates an edit suggested by @fantasai in #12825 after that
PR had been closed.

Co-Authored-By: fantasai <fantasai.bugs@inkedblade.net>

Author: andreubotella

css-overflow-4/Overview.bs

@@ -752,12 +752,11 @@ Indicating Block-Axis Overflow: the 'block-ellipsis' property</h3>
 		line-clamp-auto-017.html
 	</wpt>
 
-	Ignoring any intervening [=absolutely positioned=] element
-	or any element closing boundary,
-	this property only affects a line box
-	if it immediately precedes either a [=region break=] or a [=clamp point=],
-	and the line box is in the same [=independent formatting context=]
-	as the [=clamp point=] or the [=region break=].
+	Ignoring any intervening [=absolutely positioned=] elements
+	or element closing boundaries,
+	this property affects a line box
+	that immediately precedes a [=region break=] or a [=clamp point=]
+	when both participate in the same [=independent formatting context=].
 
 	<wpt>
 		line-clamp-auto-034.html
@@ -768,6 +767,65 @@ Indicating Block-Axis Overflow: the 'block-ellipsis' property</h3>
 
 	Note: See ''continue: discard'' for a way to generate boxes with such a [=region break=].
 
+	<div class=example>
+		```html
+		<div style="continue: collapse; block-ellipsis: auto; max-height: 4lh">
+		  <div>
+		    <div>
+			  Line 1 <br>
+			  Line 2 <br>
+			  Line 3 <br>
+			  Line 4
+			  <div class="abspos"></div>
+			</div>
+			<div class="abspos"></div>
+		  </div>
+		  <div class="abspos"></div>
+		  <!-- the clamp point is here, not immediately after line 4 -->
+		  Line 5
+		</div>
+		```
+
+		Here the clamp point is not immediately after a line box,
+		but the only thing between it and the last line box
+		are element closing boundaries and abspos,
+		and both are in the same independent formatting context,
+		so "Line 4" is ellipsized.
+	</div>
+
+	<div class=example>
+		Meanwhile, in this example,
+		there is an in-flow element
+		between the line box and the clamp point,
+		so no ellipsis is shown:
+
+		```html
+		<div style="continue: collapse; block-ellipsis: auto; max-lines: 2">
+		  Line 1 <br>
+		  Line 2
+		  <div></div>
+		  <!-- the clamp point is here -->
+		  Line 3
+		</div>
+		```
+	</div>
+
+	<div class=example>
+		In this example,
+		the last line box is contained
+		in an [=independent formatting context=],
+		so no ellipsis will be shown:
+
+		```html
+		<div style="continue: collapse; max-height: 2lh; block-ellipsis: auto">
+		  Line 1
+		  <div style="display: flow-root">Line 2</div>
+		  <!-- the clamp point is here -->
+		  Line 3
+		</div>
+		```
+	</div>
+
 	The inserted content is called the <dfn>block overflow ellipsis</dfn>.
 	Values have the following meanings: