8000 [css-ruby] First draft of anonymous box generation rules... · w3c/csswg-drafts@5dd5597 · GitHub
Skip to content

Commit 5dd5597

Browse files
fantasaifantasai
committed
[css-ruby] First draft of anonymous box generation rules...
1 parent 3cc4453 commit 5dd5597

2 files changed

Lines changed: 341 additions & 47 deletions

File tree

‎css-ruby/Overview.html‎

Lines changed: 223 additions & 38 deletions
8096
Original file line numberDiff line numberDiff line change
@@ -186,13 +186,26 @@ <h2 class="no-num no-toc" id=contents> Table of Contents</h2>
186186
<li><a href="#ruby-display"><span class=secno>2.1. </span> Ruby-specific
187187
‘<code class=property>display</code>’ property values</a>
188188

189-
<li><a href="#box-model"><span class=secno>2.2. </span> Ruby box
189+
<li><a href="#box-fixup"><span class=secno>2.2. </span> Anonymous Ruby
190+
Box Generation</a>
191+
192+
<li><a href="#pairing"><span class=secno>2.3. </span> Ruby Pairing and
193+
Annotation Levels</a>
194+
<ul class=toc>
195+
<li><a href="#nested-pairing"><span class=secno>2.3.1. </span> Nested
196+
Ruby</a>
197+
</ul>
198+
199+
<li><a href="#box-model"><span class=secno>2.4. </span> Generating Ruby
200+
Structure</a>
201+
202+
<li><a href="#box-model"><span class=secno>2.5. </span> Ruby box
190203
model</a>
191204

192-
<li><a href="#ruby-line-height"><span class=secno>2.3. </span> Ruby box
205+
<li><a href="#ruby-line-height"><span class=secno>2.6. </span> Ruby box
193206
and line stacking</a>
194207

195-
<li><a href="#ruby-line-breaking"><span class=secno>2.4. </span> Ruby
208+
<li><a href="#ruby-line-breaking"><span class=secno>2.7. </span> Ruby
196209
box and line breaking</a>
197210
</ul>
198211

@@ -392,14 +405,14 @@ <h2 id=ruby-model><span class=secno>2. </span> Ruby Formatting Model</h2>
392405
more levels of <dfn id=ruby-annotation>ruby annotation</dfn> elements
393406
representing the annotations. The structure of ruby is similar to that
394407
of a table: there are “rows” (the base text level, each annotation
395-
level) and “columns” (each <a href="#ruby-base"><i>ruby base</i></a>
396-
and its corresponding <a href="#ruby-annotation"><i>ruby
397-
annotations</i></a>).
408+
level) and “columns” (each <a href="#ruby-base-box"><i>ruby
409+
base</i></a> and its corresponding <a
410+
href="#ruby-annotation-box"><i>ruby annotations</i></a>).
398411

399412
<p>Consecutive bases and annotations are grouped together into <dfn
400413
id=ruby-segments>ruby segments</dfn>. Within a <i>ruby segment</i>, a <a
401-
href="#ruby-annotation"><i>ruby annotation</i></a> may span multiple <a
402-
href="#ruby-base"><i>ruby bases<i>. </i></i></a>
414+
href="#ruby-annotation-box"><i>ruby annotation</i></a> may span multiple
415+
<a href="#ruby-base-box"><i>ruby bases<i>. </i></i></a>
403416

404417
<p class=note>In HTML, a single <code>&lt;ruby&gt;</code> element may
405418
contain multiple <a href="#ruby-segments"><i>ruby segments</i></a>. (In
@@ -434,48 +447,199 @@ <h3 id=ruby-display><span class=secno>2.1. </span> Ruby-specific ‘<code
434447
<dl>
435448
<dt>‘<a href="#ruby"><code class=css>ruby</code></a>’
436449

437-
<dd>Specifies that an element generates a <dfn
438-
id=ruby-container-box>ruby container box</dfn>. (Corresponds to
439-
HTML/XHTML <code>&lt;ruby&gt;</code> elements.)
450+
<dd>Specifies that an element generates a <dfn id=ruby-container-box
451+
title="ruby container | ruby container box">ruby container box</dfn>.
452+
(Corresponds to HTML/XHTML <code>&lt;ruby&gt;</code> elements.)
440453

441454
<dt>‘<code class=css>ruby-base</code>’
442455

443-
<dd>Specifies that an element generates a <dfn id=ruby-base-box>ruby
444-
base box</dfn>. (Corresponds to HTML/XHTML <code>&lt;rb&gt;</code>
445-
elements.)
456+
<dd>Specifies that an element generates a <dfn id=ruby-base-box
457+
title="ruby base box | ruby base">ruby base box</dfn>. (Corresponds to
458+
HTML/XHTML <code>&lt;rb&gt;</code> elements.)
446459

447460
<dt>‘<code class=css>ruby-text</code>’
448461

449-
<dd>Specifies that an element generates a <dfn
450-
id=ruby-annotation-box>ruby annotation box</dfn>. (Corresponds to
451-
HTML/XHTML <code>&lt;rt&gt;</code> elements.)
462+
<dd>Specifies that an element generates a <dfn id=ruby-annotation-box
463+
title="ruby annotation box | ruby annotation">ruby annotation
464+
box</dfn>. (Corresponds to HTML/XHTML <code>&lt;rt&gt;</code>
465+
elements.)
452466

453467
<dt>‘<code class=css>ruby-base-container</code>’
454468

455469
<dd>Specifies that an element generates a <dfn
456-
id=ruby-base-container-box>ruby base container box</dfn>. (Corresponds
457-
to XHTML <code>&lt;rbc&gt;</code> elements; always implied in HTML.)
470+
id=ruby-base-container-box
471+
title="ruby base container box | ruby base container">ruby base
472+
container box</dfn>. (Corresponds to XHTML <code>&lt;rbc&gt;</code>
473+
elements; always implied in HTML.)
458474

459475
<dt>‘<code class=css>ruby-text-container</code>’
460476

461477
<dd>Specifies that an element generates a <dfn
462-
id=ruby-annotation-container-box>ruby annotation container box</dfn>.
463-
(Corresponds to HTML/XHTML <code>&lt;ruby&gt;</code> elements.)
478+
id=ruby-annotation-container-box
479+
title="ruby annotation container box | ruby annotation container">ruby
480+
annotation container box</dfn>. (Corresponds to HTML/XHTML
481+
<code>&lt;ruby&gt;</code> elements.)
464482
</dl>
465483

484+
<h3 id=box-fixup><span class=secno>2.2. </span> Anonymous Ruby Box
485+
Generation</h3>
486+
466487
<p>The CSS model does not require that the document language include
467488
elements that correspond to each of these components. Missing parts of
468-
the structure are implied through the anonymous box generation rules.
469-
470-
<p class=issue>The spec needs to address anonymous box generation rules
471-
(and to make them compatible with HTML5 ruby markup).
472-
473-
<p class=issue>How should box generation rules deal with ruby elements
474-
that contain block-level boxes? Turn them into inline blocks? Treat them
475-
as ‘<code class=css>display: none</code>’? Force them to float?
476-
Something else?
477-
478-
<h3 id=box-model><span class=secno>2.2. </span> Ruby box model</h3>
489+
the structure are implied through the anonymous box generation rules <a
490+
href="http://www.w3.org/TR/CSS21/tables.html#anonymous-boxes">similar to
491+
those used to normalize tables</a>. <a href="#CSS21"
492+
rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a>
493+
494+
<ol>
495+
<li>Any in-flow block-level boxes directly contained by a <a
496+
href="#ruby-container-box"><i>ruby container</i></a>, <a
497+
href="#ruby-base-container-box"><i>ruby base container</i></a>, <a
498+
href="#ruby-annotation-container-box"><i>ruby annotation
499+
container</i></a>, <a href="#ruby-base-box"><i>ruby base box</i></a>,
500+
or <a href="#ruby-annotation-box"><i>ruby annotation box</i></a> are
501+
forced to be inline-level boxes, and their ‘<code
502+
class=property>display</code>’ value computed accordingly. For
503+
example, the ‘<code class=property>display</code>’ property of an
504+
in-flow element with ‘<code class=css>display: block</code>’
505+
parented by an element with ‘<code class=css>display:
506+
ruby-text</code>’ computes to ‘<code
507+
class=css>inline-block</code>’. This computation occurs after any
508+
intermediary anonymous-box fixup (such as that required by internal
509+
table elements).
510+
511+
<li>Any consecutive sequence of <a href="#ruby-base-box"><i>ruby
512+
bases</i></a> not parented by a <a
513+
href="#ruby-base-container-box"><i>ruby base container</i></a> is
514+
wrapped in an anonymous <a href="#ruby-base-container-box"><i>ruby base
515+
container</i></a>. Similarly, any consecutive sequence of <a
516+
href="#ruby-annotation-box"><i>ruby annotations</i></a> not parented by
517+
a <a href="#ruby-annotation-container-box"><i>ruby annotation
518+
container</i></a> is wrapped in an anonymous <a
519+
href="#ruby-annotation-container-box"><i>ruby annotation
520+
container</i></a>.
521+
522+
<li>Within each <a href="#ruby-base-container-box"><i>ruby base
523+
container</i></a>, each sequence of inline-level boxes is wrapped in an
524+
anonymous <a href="#ruby-base-box"><i>ruby base box</i></a>. Similarly,
525+
within each <a href="#ruby-annotation-container-box"><i>ruby annotation
526+
container</i></a>, each sequence of inline-level boxes is wrapped in an
527+
anonymous <a href="#ruby-annotation-box"><i>ruby annotation
528+
box</i></a>.
529+
530+
<li>A sequence of <a href="#ruby-base-container-box"><i>ruby base
531+
containers</i></a> and/or <a
532+
href="#ruby-annotation-container-box"><i>ruby annotation
533+
containers</i></a> not parented by a <a
534+
href="#ruby-container-box"><i>ruby container</i></a> is wrapped in an
535+
anonymous <a href="#ruby-container-box"><i>ruby container</i></a>.
536+
</ol>
537+
538+
<p>At this point, all ruby layout structures are properly parented, and
539+
the UA can start to associate bases with their annotations.
540+
541+
<p class=note> Note that the UA is not required to create any of these
542+
anonymous boxes in its internal structures, as long as pairing and
543+
layout behaves as if they existed.
544+
545+
<h3 id=pairing><span class=secno>2.3. </span> Ruby Pairing and Annotation
546+
Levels</h3>
547+
548+
<p>Within a ruby structure, each <a href="#ruby-base-box"><i>ruby
549+
bases</i></a> are associated with <a href="#ruby-annotation-box"><i>ruby
550+
annotations</i></a> and vice versa. A <a href="#ruby-base-box"><i>ruby
551+
base</i></a> can be associated with at most one <a
552+
href="#ruby-annotation-box"><i>ruby annotation</i></a> per annotation
553+
level. If there are multiple annotation levels, it can therefore be
554+
associated with multiple <a href="#ruby-annotation-box"><i>ruby
555+
annotations</i></a>. A <a href="#ruby-annotation-box"><i>ruby
556+
annotation</i></a> is associated with one or more <a
557+
href="#ruby-base-box"><i>ruby bases</i></a>; annotations can span
558+
multiple bases.
559+
560+
<p><dfn id=annotation-pairing>Annotation pairing</dfn> is the process of
561+
associating <a href="#ruby-annotation-box"><i>ruby annotations</i></a>
562+
with <a href="#ruby-base-box"><i>ruby bases</i></a>.
563+
564+
<ol>
565+
<li>
566+
<p>First, the ruby structure is divided into <a
567+
href="#ruby-segments"><i>ruby segments</i></a>, each consisting of a
568+
single <a href="#ruby-base-container-box"><i>ruby base
569+
container</i></a> followed by one or more <a
570+
href="#ruby-annotation-container-box"><i>ruby annotation
571+
containers</i></a>. If the first child of a <a
572+
href="#ruby-container-box"><i>ruby container</i></a> is a <a
573+
href="#ruby-annotation-container-box"><i>ruby annotation
574+
container</i></a>, an anonymous, empty <a
575+
href="#ruby-base-container-box"><i>ruby base container</i></a> is
576+
assumed to exist before it. Similarly, if the <a
577+
href="#ruby-container-box"><i>ruby container</i></a> contains
578+
consecutive <a href="#ruby-base-container-box"><i>ruby base
579+
containers</i></a>, anonymous, empty <a
580+
href="#ruby-annotation-container-box"><i>ruby annotation
581+
containers</i></a> are assumed to exist between them. The <a
582+
href="#ruby-base-container-box"><i>ruby base container</i></a> in each
583+
segment is thus associated with each of the <a
584+
href="#ruby-annotation-container-box"><i>ruby annotation
585+
containers</i></a> in that segment.
586+
587+
<p>Each <a href="#ruby-annotation-container-box"><i>ruby annotation
588+
containers</i></a> in a <i>ruby segment</i> represents one <dfn
589+
id=level title="annotation level | level">level</dfn> of annotation:
590+
the first one represents the first level of annotation, the second one
591+
represents the second level of annotation, and so on.
592+
593+
<li>Within each <i>ruby segment</i>, each <a
594+
href="#ruby-base-box"><i>ruby base box</i></a> in the <a
595+
href="#ruby-base-container-box"><i>ruby base container</i></a> is
596+
paired with one <a href="#ruby-annotation-box"><i>ruby annotation
597+
box</i></a> from each <a href="#ruby-annotation-container-box"><i>ruby
598+
annotation container</i></a> in its <i>ruby segment</i>. If there are
599+
not enough <a href="#ruby-annotation-box"><i>ruby annotations</i></a>
600+
in a <a href="#ruby-annotation-container-box"><i>ruby annotation
601+
container</i></a>, the last one is associated with any excess <a
602+
href="#ruby-base-box"><i>ruby bases</i></a>. (If there are not any in
603+
the <a href="#ruby-annotation-container-box"><i>ruby annotation
604+
container</i></a>, an anonymous empty one is assumed to exist.) If
605+
there are not enough <a href="#ruby-base-box"><i>ruby bases</i></a>,
606+
any remaining <a href="#ruby-annotation-box"><i>ruby
607+
annotations</i></a> are assumed to be associated with empty, anonymous
608+
bases inserted at the end of the <a
609+
href="#ruby-base-container-box"><i>ruby base container</i></a>.
610+
</ol>
611+
612+
<p>A this point, ruby “columns” are defined, each represented by a
613+
single <a href="#ruby-base-box"><i>ruby base</i></a> and associated with
614+
one <a href="#ruby-annotation-box"><i>ruby annotation</i></a> (possibly
615+
an empty, anonymous one) from each <a href="#level"><i>annotation
616+
level</i></a>.
617+
618+
<h4 id=nested-pairing><span class=secno>2.3.1. </span> Nested Ruby</h4>
619+
620+
<p>When <a href="#ruby-container-box"><i>ruby containers</i></a> are
621+
nested, pairing begins with the deepest <a
622+
href="#ruby-container-box"><i>ruby container</i></a>, then expands out,
623+
treating each <a href="#ruby-container-box"><i>ruby container</i></a>
624+
nested within another <a href="#ruby-container-box"><i>ruby
625+
container</i></a> as a <a href="#ruby-base-box"><i>ruby base</i></a>,
626+
and associating each <a href="#ruby-annotation-box"><i>ruby
627+
annotation</i></a> associated with the nested <a
628+
href="#ruby-container-box"><i>ruby container</i></a> as being associated
629+
with (spanning) all of its <a href="#ruby-base-box"><i>ruby
630+
bases</i></a>.
631+
632+
<p>Using nested <a href="#ruby-container-box"><i>ruby containers</i></a>
633+
thus allows the representation of complex spanning relationships.
634+
635+
<p class=issue>This shouldn't belong in Level 1. But HTML5 allows it, so
636+
we have to handle it. Yay HTML5.
637+
638+
<h3 id=box-model><span class=secno>2.4. </span> Generating Ruby Structure</h3>
639+
640+
<p>
641+
642+
<h3 id=box-model><span class=secno>2.5. </span> Ruby box model</h3>
479643

480644
<p>In the following description, the elements specified by Ruby
481645
Annotation <a href="#RUBY" rel=biblioentry>[RUBY]<!--{{RUBY}}--></a> are
@@ -640,7 +804,7 @@ <h3 id=box-model><span class=secno>2.2. </span> Ruby box model</h3>
640804
a styling rule for these elements that avoids rendering them such as 
641805
<samp>rp {display: none}</samp>.
642806

643-
<h3 id=ruby-line-height><span class=secno>2.3. </span> Ruby box and line
807+
<h3 id=ruby-line-height><span class=secno>2.6. </span> Ruby box and line
644808
stacking</h3>
645809

646810
<p>The interaction of the ruby box and line stacking is controlled by the
@@ -658,7 +822,7 @@ <h3 id=ruby-line-height><span class=secno>2.3. </span> Ruby box and line
658822

659823
<p>In the following figure, each line box is shown with leading space
660824
distributed before and after the two text segments (‘<code
661-
class=css>Previous line</code>’ and ‘<a href="#ruby-base"><code
825+
class=css>Previous line</code>’ and ‘<a href="#ruby-base-box"><code
662826
class=css>Ruby base</code></a>’); the dotted lines show the line box
663827
for each line. The ‘<code class=property>line-stacking-ruby</code>’
664828
property is set to ‘<code class=property>exclude-ruby</code>’. The
@@ -696,7 +860,7 @@ <h3 id=ruby-line-height><span class=secno>2.3. </span> Ruby box and line
696860
than the computed line-height of the largest ruby element within the
697861
block.
698862

699-
<h3 id=ruby-line-breaking><span class=secno>2.4. </span> Ruby box and
863+
<h3 id=ruby-line-breaking><span class=secno>2.7. </span> Ruby box and
700864
line breaking</h3>
701865

702866
<p>When a ruby falls at the end of a line where there is not sufficient
@@ -1516,7 +1680,7 @@ <h3 class=no-num id=default-parens> Generating Parentheses</h3>
15161680
not possible with CSS to express rules that will automatically and
15171681
correctly add parentheses to unparenthesized ruby annotations in HTML.
15181682
(This is because HTML ruby allows implying the <a
1519-
href="#ruby-base"><i>ruby base</i></a> from raw text, without a
1683+
href="#ruby-base-box"><i>ruby base</i></a> from raw text, without a
15201684
corresponding element.) However, these rules will handle cases where
15211685
either <code>&lt;rb&gt;</code> or <code>&lt;rtc&gt;</code> is used
15221686
rigorously.
@@ -1827,9 +1991,18 @@ <h3 class=no-num id=other-references> Other references</h3>
18271991
<h2 class=no-num id=index> Index</h2>
18281992
<!--begin-index-->
18291993
<ul class=indexlist>
1994+
<li>annotation level, <a href="#level"
1995+
title="section 2.3."><strong>2.3.</strong></a>
1996+
1997+
<li>Annotation pairing, <a href="#annotation-pairing"
1998+
title="section 2.3."><strong>2.3.</strong></a>
1999+
18302000
<li>authoring tool, <a href="#authoring-tool"
18312001
title="section 6.2."><strong>6.2.</strong></a>
18322002

2003+
<li>level, <a href="#level"
2004+
title="section 2.3."><strong>2.3.</strong></a>
2005+
18332006
<li>renderer, <a href="#renderer"
18342007
title="section 6.2."><strong>6.2.</strong></a>
18352008

@@ -1854,24 +2027,36 @@ <h2 class=no-num id=index> Index</h2>
18542027
title="section 3.3."><strong>3.3.</strong></a>
18552028

18562029
<li>ruby annotation, <a href="#ruby-annotation"
1857-
title="section 2."><strong>2.</strong></a>
2030+
title="section 2."><strong>2.</strong></a>, <a
2031+
href="#ruby-annotation-box"
2032+
title="section 2.1."><strong>2.1.</strong></a>
18582033

18592034
<li>ruby annotation box, <a href="#ruby-annotation-box"
18602035
title="section 2.1."><strong>2.1.</strong></a>
18612036

2037+
<li>ruby annotation container, <a href="#ruby-annotation-container-box"
2038+
title="section 2.1."><strong>2.1.</strong></a>
2039+
18622040
<li>ruby annotation container box, <a
18632041
href="#ruby-annotation-container-box"
18642042
title="section 2.1."><strong>2.1.</strong></a>
18652043

18662044
<li>ruby base, <a href="#ruby-base"
1867-
title="section 2."><strong>2.</strong></a>
2045+
title="section 2."><strong>2.</strong></a>, <a href="#ruby-base-box"
2046+
title="section 2.1."><strong>2.1.</strong></a>
18682047

18692048
<li>ruby base box, <a href="#ruby-base-box"
18702049
title="section 2.1."><strong>2.1.</strong></a>
18712050

2051+
<li>ruby base container, <a href="#ruby-base-container-box"
2052+
title="section 2.1."><strong>2.1.</strong></a>
2053+
18722054
<li>ruby base container box, <a href="#ruby-base-container-box"
18732055
title="section 2.1."><strong>2.1.</strong></a>
18742056

2057+
<li>ruby container, <a href="#ruby-container-box"
2058+
title="section 2.1."><strong>2.1.</strong></a>
2059+
18752060
<li>ruby container box, <a href="#ruby-container-box"
18762061
title="section 2.1."><strong>2.1.</strong></a>
18772062

0 commit comments

Comments
 (0)