@@ -802,7 +802,7 @@ Text Processing</h3>
802
802
word-break/word-break-break-all-017.html
803
803
</wpt>
804
804
805
- Such preserved spaces take up space and do not hang,
805
+ Such preserved spaces take up space and do not [= hang=] ,
806
806
and thus affect the box's intrinsic sizes
807
807
([=min-content size=] and [=max-content size=] ).
808
808
@@ -843,11 +843,9 @@ Text Processing</h3>
843
843
In general, <a>preserved white space</a> is measured when calculating
844
844
the intrinsic sizes ([=min-content size=] and [=max-content size=] ) of text;
845
845
however <a>preserved white space</a>
846
- that would be allowed to <a>hang</a> at the end of the line
846
+ that would <a>hang</a> when at the end of the line
847
847
(i.e. that preserved by ''pre-wrap'' )
848
- is excluded--
849
- that is, considered to <a>hang</a> --
850
- when calculating <a>min-content sizes</a> and any sizes derived thereof.
848
+ is excluded.
851
849
852
850
<p> The following informative table summarizes the behavior of various
853
851
'white-space' values:</p>
@@ -1535,8 +1533,7 @@ Text Processing</h3>
1535
1533
at the end of a line:
1536
1534
<ul>
1537
1535
<li> If 'white-space' is set to ''pre-wrap'' ,
1538
- the UA must <a>hang</a> this sequence
1539
- if it does not otherwise fit prior to justification.
1536
+ the UA must [=conditionally hang=] this sequence.
1540
1537
It may also visually collapse the character advance widths
1541
1538
of any that would otherwise overflow.
1542
1539
@@ -1572,10 +1569,10 @@ Text Processing</h3>
1572
1569
white-space/white-space-intrinsic-size-004.html
1573
1570
</wpt>
1574
1571
1575
- Note: Hanging the white space rather than collapsing it
1572
+ Note: [= Hanging=] the white space rather than collapsing it
1576
1573
allows users to see the space when selecting or editing text.
1577
1574
<li> If 'white-space' is set to ''break-spaces'' ,
1578
- hanging or collapsing the advance width of spaces
1575
+ [= hanging=] or collapsing the advance width of spaces
1579
1576
at the end of the line is not allowed;
1580
1577
those that overflow must <a>wrap</a> to the next line.
1581
1578
@@ -4186,8 +4183,60 @@ Cursive Scripts</h4>
4186
4183
For this reason, it is often wise to specify 'text-indent: 0' on
4187
4184
elements that are specified 'display: inline-block' .</p>
4188
4185
4189
- <h3 id="hanging-punctuation-property" caniuse="css-hanging-punctuation" oldids="hanging-punctuation">
4190
- Hanging Punctuation: the 'hanging-punctuation' property</h3>
4186
+ <h3 id="hanging">
4187
+ Hanging Glyphs</h3>
4188
+
4189
+ <p> When a glyph at the start or end edge of a line <dfn lt="hang">hangs</dfn> ,
4190
+ it is not considered
4191
+ when measuring the line's contents for fit, alignment, or justification.
4192
+ Depending on the line's alignment/justification, this can
4193
+ result in the mark being placed outside the line box.
4194
+ The [=hanging=] glyph is also not taken into account
4195
+ when computing intrinsic sizes (min-content size and max-content size),
4196
+ and any sizes derived thereof.
4197
+ (The interaction of this measurement and kerning is currently UA-defined;
4198
+ the CSSWG <a href="https://github.com/w3c/csswg-drafts/issues/2397">welcomes advice</a> on this point.)
4199
+
4200
+ <p> A <a lt=hang>hanging</a> glyph
4201
+ is still enclosed inside its parent inline box,
4202
+ is still counted as part of the <a>scrollable overflow region</a> [[!CSS-OVERFLOW-3]] ,
4203
+ and still participates in text justification:
4204
+ its character advance is just not measured when determining
4205
+ how much content fits on the line,
4206
+ how much the line's contents need to be expanded or compressed for justification,
4207
+ or how to position the content within the line box for text alignment.
4208
+ Effectively, the <a>hanging</a> glyph character advance
4209
+ is re-interpreted as an additional negative margin
4210
+ on the affected edge of its parent <a>inline box</a> ;
4211
+ the line is otherwise laid out as usual.
4212
+
4213
+ <wpt>
4214
+ hanging-punctuation/hanging-scrollable-001.html
4215
+ </wpt>
4216
+
4217
+ <p> In some cases, a glyph at the end of a line
4218
+ can <dfn>conditionally hang</dfn> :
4219
+ it [=hangs=] only if it does not otherwise fit in the line prior to justification.
4220
+ It is not considered when measuring the line’s contents for fit.
4221
+ However, any part of it that does not fit
4222
+ is considered to [=hang=] .
4223
+ Glyphs that [=conditionally hang=] are not taken into account
4224
+ when computing [=min-content sizes=]
4225
+ and any sizes derived thereof,
4226
+ but they are taken into account for [=max-content sizes=]
4227
+ and any sizes derived thereof.
4228
+
4229
+ <p> Non-zero inline-axis borders or padding between
4230
+ a <a>hang</a> able glyph and the edge of the line prevent the glyph from hanging.
4231
+ For example, a period at the end of an inline box with end padding
4232
+ does not <a>hang</a> at the end edge of a line.
4233
+
4234
+ <p> Multiple adjacent glyphs can hang together,
4235
+ however there may be limits on how many are allowed to hang
4236
+ (e.g. at most one punctuation character may <a>hang</a> at each edge of the line).
4237
+
4238
+ <h4 id="hanging-punctuation-property" caniuse="css-hanging-punctuation" oldids="hanging-punctuation">
4239
+ Hanging Punctuation: the 'hanging-punctuation' property</h4>
4191
4240
4192
4241
<pre class="propdef">
4193
4242
Name : hanging-punctuation
@@ -4213,18 +4262,11 @@ Cursive Scripts</h4>
4213
4262
<p class="note"> Note: If there is not sufficient padding on the
4214
4263
block container, 'hanging-punctuation' can trigger overflow.</p>
4215
4264
4216
- <p> When a glyph <dfn lt="hang">hangs</dfn> , it is not considered
4217
- when measuring the line's contents for fit, alignment, or justification.
4218
- Depending on the line's alignment/justification, this can
4219
- result in the mark being placed outside the line box.
4220
- (The interaction of this measurement and kerning is currently UA-defined;
4221
- the CSSWG <a href="https://github.com/w3c/csswg-drafts/issues/2397">welcomes advice</a> on this point.)
4222
-
4223
4265
<p> Values have the following meanings:</p>
4224
4266
4225
4267
<dl dfn-for=hanging-punctuation dfn-type=value>
4226
4268
<dt> <dfn>none</dfn> </dt>
4227
- <dd> No character <a>hangs </a> .</dd>
4269
+ <dd> No punctuation character is made to <a>hang </a> .</dd>
4228
4270
<dt> <dfn>first</dfn> </dt>
4229
4271
<dd> An opening bracket or quote at the start of the
4230
4272
<a href="https://www.w3.org/TR/CSS2/selector.html#first-line-pseudo">first
@@ -4252,37 +4294,15 @@ Cursive Scripts</h4>
4252
4294
</wpt>
4253
4295
</dd>
4254
4296
<dt> <dfn>allow-end</dfn> </dt>
4255
- <dd> A <a>stop or comma</a> at the end of a line <a>hangs</a> if it
4256
- does not otherwise fit prior to justification.
4297
+ <dd> A <a>stop or comma</a> at the end of a line <a>conditionally hangs</a> .
4257
4298
4258
4299
<wpt>
4259
4300
hanging-punctuation/hanging-punctuation-allow-end-001.xht
4260
4301
</wpt>
4261
4302
</dd>
4262
4303
</dl>
4263
4304
4264
- <p> Non-zero inline-axis borders or padding between
4265
- a <a>hang</a> able mark and the edge of the line prevent the mark from hanging.
4266
- For example, a period at the end of an inline box with end padding
4267
- does not <a>hang</a> at the end edge of a line.
4268
- At most one punctuation character may <a>hang</a> at each edge of the line.
4269
-
4270
- <p> A <a lt=hang>hanging</a> mark
4271
- is still enclosed inside its parent inline box,
4272
- is still counted as part of the <a>scrollable overflow region</a> [[!CSS-OVERFLOW-3]] ,
4273
- and still participates in text justification:
4274
- its character advance is just not measured when determining
4275
- how much content fits on the line,
4276
- how much the line's contents need to be expanded or compressed for justification,
4277
- or how to position the content within the line box for text alignment.
4278
- Effectively, the <a>hanging</a> glyph character advance
4279
- is re-interpreted as an additional negative margin
4280
- on the affected edge of its parent <a>inline box</a> ;
4281
- the line is otherwise laid out as usual.
4282
-
4283
- <wpt>
4284
- hanging-punctuation/hanging-scrollable-001.html
4285
- </wpt>
4305
+ <p> At most one punctuation character may <a>hang</a> at each edge of the line.
4286
4306
4287
4307
<p> <dfn lt="stop or comma">Stops and commas</dfn> allowed to <a>hang</a> include:
4288
4308
<table class="data">
0 commit comments