[css-contain=] improve terminology

Closes #5590

Author: frivoal

css-contain-1/Overview.bs

@@ -151,7 +151,7 @@ Strong Containment: the 'contain' property</h2>
 		<dt><dfn>size</dfn>
 		<dd>
 			The value turns on <a>size containment</a> for the element.
-			This ensures that the containing box can be laid out
+			This ensures that the [=size containment box|containment box=] can be laid out
 			without needing to examine its descendants.
 
 			<wpt>
@@ -218,7 +218,7 @@ Strong Containment: the 'contain' property</h2>
 		<dt><dfn>layout</dfn>
 		<dd>
 			This value turns on <a>layout containment</a> for the element.
-			This ensures that the containing box is <em>totally opaque</em> for layout purposes;
+			This ensures that the [=layout containment box|containment box=] is <em>totally opaque</em> for layout purposes;
 			nothing outside can affect its internal layout,
 			and vice versa.
 
@@ -270,7 +270,7 @@ Strong Containment: the 'contain' property</h2>
 		<dt><dfn>paint</dfn>
 		<dd>
 			This value turns on <a>paint containment</a> for the element.
-			This ensures that the descendants of the containing box don't display outside its bounds,
+			This ensures that the descendants of the [=paint containment box|containment box] don't display outside its bounds,
 			so if an element is off-screen or otherwise not visible,
 			its descendants are also guaranteed to be not visible.
 
@@ -389,7 +389,7 @@ Size Containment</h3>
 	or a <a spec="css-display-3" lt="atomic inline">non-atomic</a> <a spec="css-display-3">inline-level</a> box,
 	size containment has no effect.
 	Otherwise, giving an element <dfn export>size containment</dfn>
-	makes its [=principal box=] a <dfn for="size containment">containing box</dfn> for [=size containment=]
+	makes its [=principal box=] a <dfn>size containment box</dfn>
 	and has the following effects:
 
 	<wpt>
@@ -427,7 +427,7 @@ Size Containment</h3>
 	contain-size-056.html
 	</wpt>
 
-	1. When calculating the size of the [=size containment/containing box=],
+	1. When calculating the size of the [=size containment box=],
 		including when computing its [=intrinsic size=],
 		it must be treated as having no contents.
 
@@ -469,7 +469,7 @@ Size Containment</h3>
 		</wpt>
 
 		Then,
-		its contents must then be laid out into the [=size containment/containing box=]'s resolved size normally (including any pseudo-elements),
+		its contents must then be laid out into the [=size containment box=]'s resolved size normally (including any pseudo-elements),
 		i.e. [=size containment=] has no effect in this phase.
 
 		Note: [=size containment=] does not suppress baseline alignment.
@@ -495,36 +495,36 @@ Size Containment</h3>
 		contain-size-replaced-006.html
 		</wpt>
 
-	2. [=size containment/Containing boxes=] for <a>size containment</a> must be treated
+	2. [=Size containment boxes=] must be treated
 		as if they had no [=intrinsic aspect ratio=].
 
-	3. [=size containment/Containing boxes=] for <a>size containment</a> are <a spec=css-break-3>monolithic</a> (See [[CSS-BREAK-3#possible-breaks]]).
+	3. [=Size containment boxes=] are <a spec=css-break-3>monolithic</a> (See [[CSS-BREAK-3#possible-breaks]]).
 
 		<wpt>
 		contain-size-breaks-001.html
 		contain-size-monolithic-001.html
 		</wpt>
 
 	By itself, <a>size containment</a> does not offer much optimization opportunity.
-	Its primary benefit on its own is that tools which want to lay out the containing box's contents
-	based on the containing box's size
+	Its primary benefit on its own is that tools which want to lay out the [=size containment box|containment box=]'s contents
+	based on the [=size containment box|containment box=]'s size
 	(such as a JS library implementing the "container query" concept)
 	can do so without fear of "infinite loops",
-	where having a child's size respond to the size of the containing box
-	causes the containing box's size to change as well,
+	where having a child's size respond to the size of the [=size containment box|containment box=]
+	causes the [=size containment box|containment box=]'s size to change as well,
 	possibly triggering <em>further</em> changes in how the child sizes itself
-	and possibly thus more changes to the containing box's size,
+	and possibly thus more changes to the [=size containment box|containment box=]'s size,
 	ad infinitum.
 
 	When paired with <a>layout containment</a>, though,
 	possible optimizations that can be enabled include (but are not limited to):
 
-	1. When the style or contents of a descendant of the containing box is changed,
+	1. When the style or contents of a descendant of the [=size containment box|containment box=] is changed,
 		calculating what part of the DOM tree is "dirtied" and might need to be re-laid out
-		can stop at the containing box.
+		can stop at the [=size containment box|containment box=].
 
 	2. When laying out the page,
-		if the containing box is off-screen or obscured,
+		if the [=size containment box|containment box=] is off-screen or obscured,
 		the layout of its contents can be delayed or done at a lower priority.
 
 <h3 id='containment-layout'>
@@ -536,7 +536,7 @@ Layout Containment</h3>
 	or a <a spec="css-display-3" lt="atomic inline">non-atomic</a> <a spec="css-display-3">inline-level</a> box,
 	layout containment has no effect.
 	Otherwise, giving an element <dfn export>layout containment</dfn>
-	makes its [=principal box=] a <dfn for="layout containment">containing box</dfn> for [=layout containment=]
+	makes its [=principal box=] a <dfn>layout containment box</dfn>
 	and has the following effects:
 
 	<wpt>
@@ -554,7 +554,7 @@ Layout Containment</h3>
 	contain-layout-independent-formatting-context-003.html
 	</wpt>
 
-	1. The [=layout containment/containing box=] [=establishes an independent formatting context=].
+	1. The [=layout containment box=] [=establishes an independent formatting context=].
 
 		<wpt>
 		contain-layout-ifc-022.html
@@ -564,10 +564,10 @@ Layout Containment</h3>
 		</wpt>
 
 	2. If at least one [=fragmentation container=] of a [=fragmentation context=] has [=layout containment=],
-		or if at least one [=fragmentation container=] of a [=fragmentation context=] is a descendant of [=layout containment/containing box=] for layout containment
+		or if at least one [=fragmentation container=] of a [=fragmentation context=] is a descendant of [=layout containment box=]
 		<strong>and</strong> at least one subsequent [=fragmentation container=] of the same [=fragmentation context=]
 		is not a descendant of that same element with layout containment,
-		then the first [=layout containment/containing box=] for [=layout containment=]
+		then the first [=layout containment box=]
 		which is either a [=fragmentation container=] itself
 		or is an ancestor of a [=fragmentation container=]
 		must “trap” the remainder of the [=fragmented flow=]:
@@ -620,7 +620,7 @@ Layout Containment</h3>
 			In this [[CSS-REGIONS-1]] example,
 			content can flow from <code>#a</code> to <code>#b</code>,
 			from <code>#b</code> to <code>#c</code>.
-			However as <code>#c</code> is the last fragment container in the first containing box for layout containment,
+			However as <code>#c</code> is the last fragment container in the first [=layout containment box=]
 			it traps all the remaining content,
 			and nothing gets flowed into <code>#d</code>, <code>#e</code>, or <code>#f</code>.
 		</div>
@@ -640,7 +640,7 @@ Layout Containment</h3>
 		contain-layout-ink-overflow-020.html
 		</wpt>
 
-	4. The [=layout containment/containing box=] acts as a containing block for absolutely positioned and fixed positioned descendants.
+	4. The [=layout containment box=] acts as a containing block for absolutely positioned and fixed positioned descendants.
 
 		<wpt>
 		contain-layout-006.html
@@ -649,15 +649,15 @@ Layout Containment</h3>
 		contain-layout-cell-002.html
 		</wpt>
 
-	5. The [=layout containment/containing box=] creates a <a>stacking context</a>.
+	5. The [=layout containment box=] creates a <a>stacking context</a>.
 
 		<wpt>
 		contain-layout-016.html
 		contain-layout-017.html
 		contain-layout-018.html
 		</wpt>
 
-	6. [=Forced breaks=] are allowed within [=layout containment/containing boxes=] for [=layout containment=],
+	6. [=Forced breaks=] are allowed within [=layout containment boxes=]
 		but do not propagate to the parent as otherwise described in [[CSS-BREAK-3#break-between]].
 
 		<wpt>
@@ -670,9 +670,9 @@ Layout Containment</h3>
 
 	7. For the purpose of the 'vertical-align' property,
 		or any other property whose effects
-		need to relate the position of the [=layout containment/containing box=]'s baseline
+		need to relate the position of the [=layout containment box=]'s baseline
 		to something other than its descendants,
-		the [=layout containment/containing box=] is treated as having no baseline.
+		the [=layout containment box|containment box=] is treated as having no baseline.
 
 		<wpt>
 		contain-layout-baseline-001.html
@@ -688,16 +688,16 @@ Layout Containment</h3>
 	Possible optimizations that can be enabled by <a>layout containment</a> include (but are not limited to):
 
 	1. When laying out the page,
-		the contents of separate containing boxes
+		the contents of separate [=layout containment boxes|containment boxes=]
 		can be laid out in parallel,
 		as they're guaranteed not to affect each other.
 
 	2. When laying out the page,
-		if the containing box is off-screen or obscured
-		and the layout of the visible parts of the screen do not depend on the size of the containing box
-		(for example, if the containing box is near the end of a block container,
+		if the [=layout containment box|containment box] is off-screen or obscured
+		and the layout of the visible parts of the screen do not depend on the size of the [=layout containment box|containment box=]
+		(for example, if the [=layout containment box|containment box=] is near the end of a block container,
 		and you're viewing the beginning of the block container),
-		the layout of the containing box' contents can be delayed or done at a lower priority.
+		the layout of the [=layout containment box|containment box]' contents can be delayed or done at a lower priority.
 
 		(When paired with <a>size containment</a>,
 		this optimization can be applied more liberally.)
@@ -711,7 +711,7 @@ Paint Containment</h3>
 	or a <a spec="css-display-3" lt="atomic inline">non-atomic</a> <a spec="css-display-3">inline-level</a> box,
 	paint containment has no effect.
 	Otherwise, giving an element <dfn export>paint containment</dfn>
-	makes its [=principal box=] a <dfn for="paint containment">containing box</dfn> for [=paint containment=]
+	makes its [=principal box=] a <dfn>paint containment box</dfn>
 	and has the following effects:
 
 	<wpt>
@@ -733,7 +733,7 @@ Paint Containment</h3>
 
 	1. The contents of the element
 		including any [=ink overflow|ink=] or [=scrollable overflow=]
-		must be clipped to the <a>padding edge</a> of the [=paint containment/containing box=],
+		must be clipped to the <a>padding edge</a> of the [=paint containment box=],
 		taking <a>corner clipping</a> into account.
 		This does not include the creation of any mechanism
 		to access or indicate the presence of the clipped content;
@@ -772,7 +772,7 @@ Paint Containment</h3>
 		contain-paint-table-001.html
 		contain-paint-table-002.html
 		</wpt>
-	2. The [=paint containment/containing box=] acts as a containing block for absolutely positioned and fixed positioned descendants.
+	2. The [=paint containment box=] acts as a containing block for absolutely positioned and fixed positioned descendants.
 
 		<wpt>
 		contain-paint-009.html
@@ -781,15 +781,15 @@ Paint Containment</h3>
 		contain-paint-023.html
 		contain-paint-024.html
 		</wpt>
-	3. The [=paint containment/containing box=] creates a <a>stacking context</a>.
+	3. The [=paint containment box=] creates a <a>stacking context</a>.
 
 		<wpt>
 		contain-paint-020.html
 		contain-paint-021.html
 		contain-paint-025.html
 		contain-subgrid-001.html
 		</wpt>
-	4. The [=paint containment/containing box=] [=establishes an independent formatting context=].
+	4. The [=paint containment box=] [=establishes an independent formatting context=].
 
 		<wpt>
 		contain-paint-ifc-011.html
@@ -804,7 +804,7 @@ Paint Containment</h3>
 <div class=informative>
 	Possible optimizations that can be enabled by <a>paint containment</a> include (but are not limited to):
 
-	1. If the containing box is off-screen or obscured,
+	1. If the [=paint containment box|containment box=] is off-screen or obscured,
 		the UA can directly skip trying to paint its contents,
 		as they're guaranteed to be off-screen/obscured as well.
 
@@ -909,6 +909,8 @@ This appendix is <em>informative</em>.
 			<li>
 				phrasing improvement in note in [[#containment-paint]]
 
+			<li>
+				terminology change: replace "containing box" with "containment box"
 		</ul>
 	<li>
 		Be explicit that size containment suppresses intrinsic aspect ratio