[css-ruby-1] Re-arrange interlinear layout section.

Author: fantasai

css-ruby-1/Overview.bs

@@ -712,49 +712,38 @@ White Space Collapsing</h3>
 Ruby Layout</h2>
 
 	When a ruby structure is laid out,
-	its [=base level=] is first laid out on the line
+	its [=base level=] is initially laid out on the line
 	exactly as if its [=ruby bases=] were a regular sequence of [=inline boxes=]
 	and the [=ruby container=] a regular [=inline box=] wrapped around it.
+
 	If a [=ruby container=] has any [=inter-character annotations=],
 	they are laid out into the [=base level=] as detailed in [[#inter-character-layout]].
+	Subsequently,
+	the [=base container=] is sized and
+	[=interlinear annotations=] are laid out
+	as detailed in [[#interlinear-layout]].
 
-	Each [=base container=] is then sized and positioned
-	to contain exactly all of its [=ruby bases=]’ margin boxes--
-	and all their associated [=inter-character=] [=ruby annotation=] margin boxes, if any--
-	as well as the [=base containers|base=] and [=annotation containers=]
-	of any descendant [=ruby containers=]
-	also participating in this [=inline formatting context=].
-	(If a [=base container=] has no [=in-flow=] content,
-	it is sized and positioned
-	as if it contained a single empty [=ruby base=].)
+	As in other CSS layout models,
+	relative positioning, transforms, and other graphical effects
+	apply after this layout of the boxes.
+
+<h3 id="interlinear-layout">
+Interlinear Ruby Layout</h3>
 
 	[=Interlinear=] [=ruby annotations=] within a level
-	are aligned to each other in the block axis
-	as if they were [=inline boxes=]
+	are initially laid out as if they were [=inline boxes=]
 	participating in the same [=inline formatting context=],
 	effectively establishing a [=line box=]
 	for that [=level=] of annotation in the [=ruby container=].
-	In the inline axis, these [=ruby annotations=] are aligned
-	with respect to their [=ruby base boxes=]
-	in accordance with their [=annotation container=]’s 'ruby-merge' value.
+	[=Annotations=] and [=bases=] are aligned to each other
+	by adjusting their spacing as described below.
 
-	Each [=interlinear=] [=annotation container=] is then sized and positioned
-	to contain exactly all of its [=ruby annotations=]’ margin boxes
-	as well as the [=base containers|base=] and [=annotation containers=]
-	of any descendant [=ruby containers=]
-	also participating in this [=annotation level=]’s [=inline formatting context=].
-	(If an [=annotation container=] has no [=in-flow=] content,
-	it is sized and positioned
-	as if it contained a single empty [=ruby annotation=].)
-	These [=annotation containers=] are then stacked outward
-	over or under (depending on 'ruby-position') their corresponding [=base container=],
-	without any intervening space,
-	thus determining the block-axis positioning of the [=ruby annotations=]
-	with respect to their [=ruby bases=].
+<h4 id="interlinear-inline">
+Inline-axis Interlinear Layout</h4>
 
-	Issue: Should block-axis margins collapse?
-	This makes layout more robust,
-	but is inconsistent with how inlines behave along the inline-axis.
+	In the inline axis, [=interlinear=] [=ruby annotations=] are aligned
+	with respect to their [=ruby base boxes=]
+	in accordance with their [=annotation container=]’s 'ruby-merge' value.
 
 	When 'ruby-merge' is ''ruby-merge/separate'',
 	each [=ruby column=] is sized
@@ -793,16 +782,44 @@ Ruby Layout</h2>
 	and are never affected by the sizing or positioning
 	of [=interlinear annotations=].
 
-	A [=ruby container=] measures as wide as the sum of its [=columns=].
-
-	Within these boxes,
+	Within each [=base=] and [=annotation=] box,
 	how the extra space is distributed
-	when ruby content is narrower than the measure of its box
-	is specified by the 'ruby-align' property.
+	when its content is narrower than the measure of the box
+	is specified by its 'ruby-align' property.
 
-	As in other CSS layout models,
-	relative positioning, transforms, and other graphical effects
-	apply after this layout of the boxes.
+<h4 id="interlinear-block">
+Block-axis Interlinear Layout</h4>
+
+	ISSUE: Define the extent to which 'vertical-align' affects these ruby boxes.
+	See <a href="https://github.com/w3c/csswg-drafts/issues/4987">Issue 4987</a>.
+
+	Each [=base container=] is then sized and positioned
+	to contain exactly all of its [=ruby bases=]’ margin boxes--
+	and all their associated [=inter-character=] [=ruby annotation=] margin boxes, if any--
+	as well as the [=base containers|base=] and [=annotation containers=]
+	of any descendant [=ruby containers=]
+	also participating in this [=inline formatting context=].
+	(If a [=base container=] has no [=in-flow=] content,
+	it is sized and positioned
+	as if it contained a single empty [=ruby base=].)
+
+	Each [=interlinear=] [=annotation container=] is sized and positioned
+	to contain exactly all of its [=ruby annotations=]’ margin boxes
+	as well as the [=base containers|base=] and [=annotation containers=]
+	of any descendant [=ruby containers=]
+	also participating in this [=annotation level=]’s [=inline formatting context=].
+	(If an [=annotation container=] has no [=in-flow=] content,
+	it is sized and positioned
+	as if it contained a single empty [=ruby annotation=].)
+	These [=annotation containers=] are then stacked outward
+	over or under (depending on 'ruby-position') their corresponding [=base container=],
+	without any intervening space,
+	thus determining the block-axis positioning of the [=ruby annotations=]
+	with respect to their [=ruby bases=].
+
+	Issue: Should block-axis margins collapse?
+	This makes layout more robust,
+	but is inconsistent with how inlines behave along the inline-axis.
 
 <h3 id="inter-character-layout">
 Inter-character Ruby Layout</h3>