8000 [css-ruby] Add basic layout section. · w3c/csswg-drafts@e4d08be · GitHub
Skip to content

Commit e4d08be

Browse files
committed
[css-ruby] Add basic layout section.
1 parent 8ede540 commit e4d08be

2 files changed

Lines changed: 107 additions & 12 deletions

File tree

css-ruby/Overview.html

Lines changed: 67 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
33
Issues:
44
bidi
5-
line-stacking
5+
box layout/sizing
66
77
Redo all examples with consistent font. (M+ 2p?)
88
@@ -20,7 +20,7 @@
2020

2121
<meta content="CSS Ruby Module Level 1" name=dcterms.title>
2222
<meta content=text name=dcterms.type>
23-
<meta content=2013-06-25 name=dcterms.date>
23+
<meta content=2013-07-09 name=dcterms.date>
2424
<meta content="Elika J. Etemad" name=dcterms.creator>
2525
<meta content="Koji Ishii" name=dcterms.creator>
2626
<meta content="Richard Ishida" name=dcterms.creator>
@@ -41,8 +41,8 @@
4141
<h1 class=p-name>CSS Ruby Module Level 1</h1>
4242

4343
<h2 class="no-num no-toc" id=longstatus-date->Editor's Draft <time
44-
class=dt-updated datetime=20130625>25 June 2013</time>
45-
<!-- for HTML4 doctype: <span class="value-title" title="20130625">25 June 2013</span></span> --></h2>
44+
class=dt-updated datetime=20130709> 9 July 2013</time>
45+
<!-- for HTML4 doctype: <span class="value-title" title="20130709"> 9 July 2013</span></span> --></h2>
4646

4747
<dl>
4848
<dt>This version:
@@ -211,10 +211,13 @@ <h2 class="no-num no-toc" id=contents> Table of Contents</h2>
211211
<li><a href="#white-space"><span class=secno>2.5. </span> White
212212
Space</a>
213213

214-
<li><a href="#line-breaking"><span class=secno>2.6. </span> Ruby box and
214+
<li><a href="#ruby-layout"><span class=secno>2.6. </span> Ruby
215+
layout</a>
216+
217+
<li><a href="#line-breaking"><span class=secno>2.7. </span> Ruby box and
215218
line breaking</a>
216219

217-
<li><a href="#line-height"><span class=secno>2.7. </span> Ruby box and
220+
<li><a href="#line-height"><span class=secno>2.8. </span> Ruby box and
218221
line stacking</a>
219222
</ul>
220223

@@ -563,7 +566,7 @@ <h3 id=pairing><span class=secno>2.3. </span> Ruby Pairing and Annotation
563566
Levels</h3>
564567

565568
<p>Within a ruby structure, each <a href="#ruby-base-box"><i>ruby
566-
bases</i></a> are associated with <a href="#ruby-annotation-box"><i>ruby
569+
base</i></a> is associated with <a href="#ruby-annotation-box"><i>ruby
567570
annotations</i></a> and vice versa. A <a href="#ruby-base-box"><i>ruby
568571
base</i></a> can be associated with at most one <a
569572
href="#ruby-annotation-box"><i>ruby annotation</i></a> per annotation
@@ -719,7 +722,8 @@ <h3 id=white-space><span class=secno>2.5. </span> White Space</h3>
719722
space is not discarded. If such white space is <i>collapsible</i>, it will
720723
collapse following the standard <a
721724
href="http://www.w3.org/TR/css3-text/#white-space-rules">white space
722-
processing rules</a>. [[!CSS3-TEXT]] Between <a
725+
processing rules</a>. <a href="#CSS3TEXT"
726+
rel=biblioentry>[CSS3TEXT]<!--{{!CSS3TEXT}}--></a> Between <a
723727
href="#ruby-segments"><i>ruby segments</i></a>, however, the contextual
724728
text for determining collapsing behavior is given by the <a
725729
href="#ruby-base-box"><i>ruby bases</i></a> on either side, not the text
@@ -780,7 +784,47 @@ <h3 id=white-space><span class=secno>2.5. </span> White Space</h3>
780784

781785
<p class=issue>Specify how this impacts layout, or not.
782786

783-
<h3 id=line-breaking><span class=secno>2.6. </span> Ruby box and line
787+
<h3 id=ruby-layout><span class=secno>2.6. </span> Ruby layout</h3>
788+
789+
<p>When a ruby structure is laid out, its base level is laid out on the
790+
line, aligned according to its ‘<code
791+
class=property>vertical-align</code>’ property exactly as if it were a
792+
regular sequence of <i>inline</i> boxes. Each <a
793+
href="#ruby-base-container-box"><i>ruby base container</i></a> is sized
794+
and positioned to contain exactly the full height of its <a
795+
href="#ruby-base-box"><i>ruby bases</i></a>.
796+
797+
<p><a href="#ruby-annotation-box"><i>Ruby annotations</i></a> associated
798+
with the base level are then positioned with respect to their <a
799+
href="#ruby-base-box"><i>ruby base boxes</i></a> according to the
800+
applicable ‘<a href="#ruby-position"><code
801+
class=property>ruby-position</code></a>’ values. <a
802+
href="#ruby-annotation-box"><i>Ruby annotations</i></a> within a level
803+
(within a single <a href="#ruby-container-box"><i>ruby container</i></a>)
804+
are aligned to each other as if they were inline boxes participating in
805+
the same inline formatting context. Each <a
806+
href="#ruby-annotation-container-box"><i>ruby annotation container</i></a>
807+
is sized and positioned to contain exactly the full height of its <a
808+
href="#ruby-annotation-box"><i>ruby annotations</i></a>.
809+
810+
<p>A ruby container (or fragment thereof) measures as wide as the content
811+
of its widest level. (In the case of ‘<code
812+
class=css>inter-character</code>’ annotations, they are spliced in and
813+
measured as part of the base level.) Similarly, <a
814+
href="#ruby-base-box"><i>ruby base boxes</i></a> and <a
815+
href="#ruby-annotation-box"><i>ruby annotation boxes</i></a> within a ruby
816+
“column” have the measure of the widest content in that “column”.
817+
In the case of spanning <i>annotations</i> (whether actual spanning or
818+
pretending to span per ‘<code class=property>ruby-collapse</code>’),
819+
the measures of the <a href="#ruby-annotation-box"><i>ruby annotation
820+
box</i></a> and the sum of its associated <a href="#ruby-base-box"><i>ruby
821+
base boxes</i></a> must match.
822+
823+
<p>How the extra space is distributed when ruby content is narrower than
824+
the measure of its box is specified by the ‘<a href="#ruby-align"><code
825+
class=property>ruby-align</code></a>’ property.
826+
827+
<h3 id=line-breaking><span class=secno>2.7. </span> Ruby box and line
784828
breaking</h3>
785829

786830
<p>When there is not enough space for an entire <a
@@ -842,7 +886,7 @@ <h3 id=line-breaking><span class=secno>2.6. </span> Ruby box and line
842886
breaking opportunity
843887
</div>
844888

845-
<h3 id=line-height><span class=secno>2.7. </span> Ruby box and line
889+
<h3 id=line-height><span class=secno>2.8. </span> Ruby box and line
846890
stacking</h3>
847891

848892
<p>The ‘<code class=property>line-height</code>’ property controls
@@ -1466,6 +1510,9 @@ <h3 id=ruby-overhang><span class=secno>4.1. </span> Overhanging Ruby</h3>
14661510
space available for overlap is determined. It is controlled by the ‘<a
14671511
href="#ruby-align"><code class=property>ruby-align</code></a>’ property.
14681512

1513+
<p class=issue> I suspect overhanging interacts with alignment in some
1514+
cases; might need to look into this later.
1515+
14691516
<p>This entire logic applies the same way in vertical ideographic layout,
14701517
only the dimension in which it works in such a layout is vertical, instead
14711518
of horizontal.
@@ -2004,6 +2051,16 @@ <h3 class=no-num id=normative-references> Normative references</h3>
20042051
</dd>
20052052
<!---->
20062053

2054+
<dt id=CSS3TEXT>[CSS3TEXT]
2055+
2056+
<dd>Elika J. Etemad; Koji Ishii. <a
2057+
href="http://www.w3.org/TR/2012/WD-css3-text-20121113/"><cite>CSS Text
2058+
Module Level 3.</cite></a> 13 November 2012. W3C Working Draft. (Work in
2059+
progress.) URL: <a
2060+
href="http://www.w3.org/TR/2012/WD-css3-text-20121113/">http://www.w3.org/TR/2012/WD-css3-text-20121113/</a>
2061+
</dd>
2062+
<!---->
2063+
20072064
<dt id=RFC2119>[RFC2119]
20082065

20092066
<dd>S. Bradner. <a href="http://www.ietf.org/rfc/rfc2119.txt"><cite>Key

css-ruby/Overview.src.html

Lines changed: 40 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -315,7 +315,7 @@ <h3 id="pairing">
315315
Ruby Pairing and Annotation Levels</h3>
316316

317317
<p>Within a ruby structure,
318-
each <i>ruby bases</i> are associated with <i>ruby annotations</i>
318+
each <i>ruby base</i> is associated with <i>ruby annotations</i>
319319
and vice versa.
320320
A <i>ruby base</i> can be associated with at most one <i>ruby annotation</i> per annotation level.
321321
If there are multiple annotation levels, it can therefore be associated with multiple <i>ruby annotations</i>.
@@ -435,7 +435,7 @@ <h3 id="white-space">
435435
Between <i>ruby segments</i>, between <i>ruby bases</i>, and between <i>ruby annotations</i>, however,
436436
white space is not discarded.
437437
If such white space is <i>collapsible</i>, it will collapse
438-
following the standard <a href="http://www.w3.org/TR/css3-text/#white-space-rules">white space processing rules</a>. [[!CSS3-TEXT]]
438+
following the standard <a href="http://www.w3.org/TR/css3-text/#white-space-rules">white space processing rules</a>. [[!CSS3TEXT]]
439439
Between <i>ruby segments</i>, however,
440440
the contextual text for determining collapsing behavior is given by the <i>ruby bases</i> on either side,
441441
not the text on either side of the white space in the source document.
@@ -485,6 +485,40 @@ <h3 id="white-space">
485485

486486
<p class="issue">Specify how this impacts layout, or not.
487487

488+
<h3 id="ruby-layout">
489+
Ruby layout</h3>
490+
491+
<p>When a ruby structure is laid out,
492+
its base level is laid out on the line,
493+
aligned according to its 'vertical-align' property
494+
exactly as if it were a regular sequence of <i>inline</i> boxes.
495+
Each <i>ruby base container</i> is sized and positioned
496+
to contain exactly the full height of its <i>ruby bases</i>.
497+
498+
<p><i>Ruby annotations</i> associated with the base level
499+
are then positioned with respect to their <i>ruby base boxes</i>
500+
according to the applicable 'ruby-position' values.
501+
<i>Ruby annotations</i> within a level (within a single <i>ruby container</i>)
502+
are aligned to each other as if they were inline boxes
503+
participating in the same inline formatting context.
504+
Each <i>ruby annotation container</i> is sized and positioned
505+
to contain exactly the full height of its <i>ruby annotations</i>.
506+
507+
<p>A ruby container (or fragment thereof)
508+
measures as wide as the content of its widest level.
509+
(In the case of ''inter-character'' annotations,
510+
they are spliced in and measured as part of the base level.)
511+
Similarly, <i>ruby base boxes</i> and <i>ruby annotation boxes</i>
512+
within a ruby “column” have the measure of the widest content in that “column”.
513+
In the case of spanning <i>annotations</i>
514+
(whether actual spanning or pretending to span per 'ruby-collapse'),
515+
the measures of the <i>ruby annotation box</i> and
516+
the sum of its associated <i>ruby base boxes</i> must match.
517+
518+
<p>How the extra space is distributed
519+
when ruby content is narrower than the measure of its box
520+
is specified by the 'ruby-align' property.
521+
488522
<h3 id="line-breaking">
489523
Ruby box and line breaking</h3>
490524

@@ -1024,6 +1058,10 @@ <h3 id="ruby-overhang">
10241058
and it is computed before the space available for overlap is determined.
10251059
It is controlled by the 'ruby-align' property.
10261060

1061+
<p class="issue">
1062+
I suspect overhanging interacts with alignment in some cases;
1063+
might need to look into this later.
1064+
10271065
<p>This entire logic applies the same way in vertical ideographic layout,
10281066
only the dimension in which it works in such a layout is vertical,
10291067
instead of horizontal.

0 commit comments

Comments
 (0)