You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
ISSUE: This is a rought draft of a proposal, and has not yet been approved by the CSSWG.
341
-
Many variants have been included to promote discussion of possible behaviors;
342
-
not all of them are expected to be kept.
343
341
See discussion in <a href="https://github.com/w3c/csswg-drafts/issues/3199">Issue 3199</a>, <a href="https://lists.w3.org/Archives/Public/www-style/2011Mar/0364.html">Hyatt's message</a>, and <a href="https://dev.w3.org/cvsweb/~checkout~/csswg/css3-linebox/Attic/Overview.html?rev=1.5;content-type=text%2Fhtml#LineStacking">dbaron's proposal</a>.
344
-
Also all the keywords are expected to be renamed.
345
342
346
343
This property controls the method by which line boxes are sized,
347
344
and thus the spacing between lines of text.
348
345
349
346
Values have the following meanings:
350
347
351
348
<dl dfn-for=line-sizing dfn-type=value>
352
-
<dt><dfn>quirks-behavior</dfn>
349
+
<dt><dfn>legacy</dfn>
353
350
<dd>
354
-
Line boxes are sized, and content positioned within them,
355
-
as defined in [[!CSS2]] except that
351
+
The inline box contributes to the sizing of its line box
352
+
based on its 'line-height',
353
+
rather than based on its box edges,
354
+
as defined in [[!CSS2]].
355
+
In Quirks Mode [[!QUIRKS]],
356
356
any <a>inline box</a><a lt="box fragment">fragment</a>
357
357
that has zero borders and padding and
358
358
that does not directly contain text or <a>preserved white space</a>[[!CSS-TEXT-3]]
359
-
is ignored for this purpose.
360
-
361
-
<dt><dfn>current-behavior</dfn>
362
-
<dd>
363
-
Line boxes are sized, and content positioned within them,
364
-
as defined in [[!CSS2]].
359
+
is ignored when sizing the line box.
365
360
366
361
Note: In this model, vertical rhythm is broken
367
362
any time there is a change in font metrics within a paragraph.
368
363
369
-
<dt><dfn>better-behavior</dfn>
364
+
<dt><dfn>normal</dfn>
370
365
<dd>
371
-
Line boxes are sized, and content positioned within them,
372
-
as defined in [[!CSS2]],
373
-
except that positive half-leading is not applied
374
-
to any box other than the <a>root inline box</a>.
366
+
The inline box contributes to the sizing of its line box
367
+
based on its <a>margin box</a>,
368
+
rather than its 'line-height'.
369
+
Half-leading is inserted inside the <a>content box</a> edges,
370
+
rather than overlapping the padding/border/margin areas.
371
+
However, positive half-leading is only applied to the <a>root inline box</a>.
372
+
Negative half-leading is applied to all inline boxes,-
373
+
reducing the size of the <a>content box</a> as needed.
375
374
376
375
Note: This will give consistent line spacing
377
376
as long as there is some amount of leading added,
378
377
such that the half-leading on the root inline
379
-
is large enough to accommodate the unleaded ascent of its descendants.
380
-
The line box will grow to accommodate
378
+
is large enough to accommodate the unleaded ascent/descent of its descendants.
379
+
The line box will grow, however, to accommodate
381
380
content that would otherwise overflow,
382
-
avoiding overlap between lines.
383
-
384
-
<dt><dfn>box-model-behavior</dfn>
385
-
<dd>
386
-
Line boxes are sized to fit the <a>root inline box</a>
387
-
and its <a>half-leading</a>,
388
-
as well as the <a>outer edges</a> of any <a>inline-level descendants</a>
389
-
in the same <a>inline formatting context</a>.
390
-
Positive half-leading is not applied to any other <a>inline box</a>;
391
-
negative half-leading is applied as negative margins
392
-
to <a>inline boxes</a> whose block-axis margins, borders, and padding
393
-
are zero.
394
-
395
-
Note: This mode is similar to ''better-behavior'',
396
-
but re-uses the familiar margin/border/padding box model
397
-
of controlling spacing.
398
-
However to ensure that 'line-height' < 1 behaves as expected,
399
-
the default case (no margin/border/padding)
400
-
needs to apply negative leading to such inlines.
401
-
402
-
<dt><dfn>absolute-behavior</dfn>
403
-
<dd>
404
-
Line boxes are sized to fit the <a>root inline box</a>
405
-
and its <a>half-leading</a>;
406
-
no other boxes are considered.
407
-
Inline-level content may overflow the line box
408
-
and overlap adjacent lines
409
-
if it extends higher or lower
410
-
than the edges of the root inline box’s leading.
381
+
to avoid overlap between lines.
411
382
</dl>
412
383
413
384
ISSUE: Should this property apply to block containers or to inline boxes?
414
385
In the latter case, an individual inline could say "pay attention to me"
415
386
or "don't pay attention to me".
416
387
417
-
ISSUE: Need better names. Maybe `loose | normal | strict | absolute`?
418
-
Maybe `quirks | legacy | normal | absolute`?
419
-
Something else?
420
-
421
388
<h2 id="inline-box-dimensions">
422
389
Drawing Inline Boxes</h2>
423
390
@@ -451,10 +418,11 @@ Inline Box Heights: the 'inline-sizing' property</h3>
451
418
452
419
<dt><dfn>stretch</dfn>
453
420
<dd>
454
-
The <a>logical height</a> of the <a>content area</a>
421
+
Once the line box has been sized,
422
+
the final <a>logical height</a> of the <a>inline box</a>’s <a>content area</a>
455
423
is calculated as the <a>stretch fit</a>
456
-
into the line box.
457
-
The box is then positioned such that its <a>margin edges</a>
424
+
into the line box,
425
+
and it is positioned such that its <a>margin edges</a>
458
426
coincide with the line box’s edges.
459
427
</dl>
460
428
@@ -1841,13 +1809,23 @@ A.2: Synthesizing Baselines for Replaced Content</h3>
1841
1809
<h2 class="no-num" id="changes">
1842
1810
Changes</h2>
1843
1811
1812
+
Changes since the
1813
+
<a href="https://www.w3.org/TR/2018/WD-css-inline-3-20180808/">8 August 2018 Working Draft</a>
1814
+
include:
1815
+
1816
+
<ul>
1817
+
<li>
1818
+
Added 'line-sizing' property to control how inter-line spacing is calculated.
0 commit comments