[css-inline] Drop cap size calculation depends only on line height (or baseline grid) of containing block

Author: dauwhe

css-inline/Overview.bs

@@ -56,7 +56,7 @@ A <dfn>drop initial</dfn> is a larger-than-usual letter at the start of a paragr
 
 </div>
 
-Drop initials are all about alignment. Reference points on the drop cap must align precisely with reference points in the text. In Western scripts, the top reference points are the cap height of the initial letter and of the first line of text. The bottom reference points are the baseline of the initial letter and the baseline of the Nth line of text. <a href="#f2">Figure 2</a> shows a simple two-line drop cap, with the relevant reference lines marked. 
+The exact size and position of a drop cap depends on the alignment of its glyph. [TK] Reference points on the drop cap must align precisely with reference points in the text. In Western scripts, the top reference points are the cap height of the initial letter and of the first line of text. The bottom reference points are the alphabetic baseline of the initial letter and the baseline of the Nth line of text. <a href="#f2">Figure 2</a> shows a simple two-line drop cap, with the relevant reference lines marked. 
 
 
 
@@ -69,55 +69,22 @@ Drop initials are all about alignment. Reference points on the drop cap must ali
 
 
 
-<div class="note">
-<p>The size of a drop initial is determined by the need to satisfy the required alignment. For an N-line drop initial in a Western script, the cap-height of the letter needs to be (N – 1) times the line-height, plus the cap-height of the surrounding text. Note this height is <b>not</b> the font size of the drop initial.</p>
 
 
-<p>Actually calculating this font size is tricky. For an N-line drop initial, we find the drop initial font size to be:</p>
+The alignment constraints for drop initials depend on the writing system. In Japanese, the initial letter extends from the <a>block-start</a> edge of the first line to the <a>block-end</a> edge of the Nth line.
 
 
 <figure>
-<img src="InitialCapEquation.png" width="604" alt="Equation to calcuate drop initial font size"/>
+  <img src="Initial-2line-JapaneseVertical六.png" width="480" alt="Japanese Vertical Initial"/>
+  <p class="caption">Two-line drop initial in vertical writing mode</p>
 </figure>
 
-<!--
-<pre>
-Font size of drop cap = ((N-1) * line-height + [cap-height of para] * [font size of paragraph])/[cap-height ratio of drop initial font]
-</pre>
--->
-
-<!--
-
-<div>
-
-<math display="block"><mrow><mi>Font size of drop initial</mi><mo>=</mo></mrow><mfrac><mrow><mo>(</mo><mi>N</mi><mo>-</mo><mn>1</mn><mo>)</mo><mo>&#x00D7;</mo><mi>line-height</mi><mo>+</mo><mo>(</mo><mi>cap-height ratio of para font</mi><mo>&#x00D7;</mo><mi>font size of para</mi><mo>)</mo></mrow><mrow><mi>cap-height ratio of drop initial font</mi></mrow></mfrac></math>
-</div>
-
--->
-
-
-A three-line drop initial in Adobe Minion Pro would have a font size of 61.2pt, given 12pt text, 16pt line-height and a cap-height of 651/1000 (from the font’s OS/2 table).
-</div>
-
-
-The alignment constraints depend on the script used. In Japanese vertical writing mode, it appears that the initial letter extends from the start edge of the first line to the end edge of the Nth line. 
-
 <figure>
-<img src="CJK-Initial.001.png" width="480" alt="Diagram of Japanese initial letter in vertical writing mode"/>
-<p class="caption">Diagram of Japanese initial letter in vertical writing mode</p>
+  <img src="CJK-Initial.001.png" width="480" alt="Diagram of Japanese initial letter in vertical writing mode"/>
+  <p class="caption">Diagram of Japanese initial letter in vertical writing mode</p>
 </figure>
 
-
-
-<figure>
-<img src="Initial-2line-JapaneseVertical六.png" width="480" alt="Japanese Vertical Initial"/>
-<p class="caption">Two-line drop initial in vertical writing mode</p>
-</figure>
-<p class="issue">This figure is probably incorrect.</p>
-
-
-
-<p class="issue">Add content describing constraint that the block container have a baseline grid (or fixed line-height?).</p>
+Note: In some cases, the exclusion area for the drop initial is larger than its glyph in order to preserve inline-axis alignment. This effect is out-of-scope for this level. However, extra spacing can still be given using margins.
 
 
 <h3 id="selecting-drop-initials">Selecting Initial Letters</h3>
@@ -222,6 +189,8 @@ p::first-letter {
 
 
 
+
+
 <h3 id="aligning-initial-letter">Alignment of Initial Letters</h3>
 
 As mentioned earlier, the alignment of initial letters depends on the script used. The 'initial-letter-align' property can be used to specify the proper alignment.
@@ -271,7 +240,38 @@ If 'initial-letter' is applied to an image or other atomic element that does not
 Issue: Need to decide whether using margin edges or content edges for alignment. Writing Modes uses the margin edges for baseline alignment of replaced elements. There are cases for both content-alignment and margin-alignment for text. In both cases the margin box needs to be excluded.
 
 
+<h3>Sizing Initial Letters</h3>
+
+<p>The size of a drop initial is determined by the need to satisfy the required alignment. For an N-line drop initial in a Western script, the cap-height of the letter needs to be (N – 1) times the line-height, plus the cap-height of the surrounding text. Note this height is <b>not</b> the font size of the drop initial.</p>
+
+
+<p>Actually calculating this font size is tricky. For an N-line drop initial, we find the drop initial font size to be:</p>
+
+
+<figure>
+<img src="InitialCapEquation.png" width="604" alt="Equation to calcuate drop initial font size"/>
+</figure>
+
+<!--
+<pre>
+Font size of drop cap = ((N-1) * line-height + [cap-height of para] * [font size of paragraph])/[cap-height ratio of drop initial font]
+</pre>
+-->
+
+<!--
+
+<div>
 
+<math display="block"><mrow><mi>Font size of drop initial</mi><mo>=</mo></mrow><mfrac><mrow><mo>(</mo><mi>N</mi><mo>-</mo><mn>1</mn><mo>)</mo><mo>&#x00D7;</mo><mi>line-height</mi><mo>+</mo><mo>(</mo><mi>cap-height ratio of para font</mi><mo>&#x00D7;</mo><mi>font size of para</mi><mo>)</mo></mrow><mrow><mi>cap-height ratio of drop initial font</mi></mrow></mfrac></math>
+</div>
+
+-->
+
+<div class="example">
+  A three-line drop initial in Adobe Minion Pro would have a font size of 61.2pt, given 12pt text, 16pt line-height and a cap-height of 651/1000 (from the font’s OS/2 table).
+</div>
+
+The line height used in this calculation is the 'line-height' of the containing block (or, in the case where a baseline grid is in use, the baseline-to-baseline spacing required by the baseline grid [[CSS3-LINE-GRID]]). The contents of the lines spanned, and therefore any variation in their heights and positions, is not accounted for.
 
 <h3 id="initial-letter-exclusions">Space Around Initial Letters</h3>
 
@@ -292,7 +292,7 @@ Text should be excluded around the glyph bounding boxes of the initial letters:
 </figure>
 
 
-<h3 id="initial-letter-paragraphs">Interactions of initial letters with surrounding paragraphs</h3>
+<h3 id="initial-letter-paragraphs">Clearing Initial Letters</h3>
 
 <h4 id="raised-sunken-caps">Raised and sunken caps</h4>
 
@@ -304,6 +304,8 @@ An initial letter does not affect the position of its containing element. For 
 <p class="caption">Raised cap (<code>initial-letter: 3 1</code>) on right; note that the position of the “C” is the same in both cases, but on the right all text is moved down relative to the initial letter.</p>
 </figure>
 
+Issue: Handle glyph ink above cap height of font.
+
 
 <h4 id="short-para-initial-letter">Short paragraphs with initial letters</h4>