12
12
rel =dcterms.rights >
13
13
< meta content ="CSS Fragmentation Module Level 3 " name =dcterms.title >
14
14
< meta content =text name =dcterms.type >
15
- < meta content =2013-10-10 name =dcterms.date >
15
+ < meta content =2013-11-13 name =dcterms.date >
16
16
< meta content ="Rossen Atanassov " name =dcterms.creator >
17
17
< meta content ="Microsoft Corporation " name =dcterms.creator >
18
18
< meta
31
31
< p > < a href ="http://www.w3.org/ "> < img alt =W3C height =48
32
32
src ="http://www.w3.org/Icons/w3c_home " width =72 > </ a > <!--end-logo-->
33
33
34
- < h1 id =css-fragmentation-module > CSS Fragmentation Module Level 3</ h1 >
34
+ < h1 id =css-fragmentation-module > CSS Fragmentation Module Level 3:< br >
35
+ Breaking the Web, one fragment at a time</ h1 >
35
36
36
- < h2 class ="no-num no-toc "> Editor's Draft 10 October 2013</ h2 >
37
+ < h2 class ="no-num no-toc "> Editor's Draft 13 November 2013</ h2 >
37
38
38
39
< dl >
39
40
< dt > This version:</ dt >
40
- <!--<dd><a href="http://dev.w3.org/csswg/css3-break/">http://www.w3.org/TR/2013/WD-css3-break-20131010 /</a></dd>-->
41
+ <!--<dd><a href="http://dev.w3.org/csswg/css3-break/">http://www.w3.org/TR/2013/WD-css3-break-20131113 /</a></dd>-->
41
42
42
43
< dd > < a
43
44
href ="http://dev.w3.org/csswg/css3-break/ "> http://dev.w3.org/csswg/css3-break/</ a >
@@ -284,11 +285,11 @@ <h2 id=intro><span class=secno>1. </span> Introduction</h2>
284
285
285
286
< p > In CSS, in addition to paged media, certain layout features such as < a
286
287
href ="http://www.w3.org/TR/css3-regions/ "> regions</ a > < a
287
- href ="#CSS3-REGIONS "
288
+ href ="#ref- CSS3-REGIONS "
288
289
rel =biblioentry > [CSS3-REGIONS]<!--{{CSS3-REGIONS}}--> </ a > and < a
289
290
href ="http://www.w3.org/TR/css3-multicol/ "> multi-column layout</ a > < a
290
- href ="#CSS3COL " rel =biblioentry > [CSS3COL]<!--{{CSS3COL}}--> </ a > create a
291
- similarly fragmented environment. The generic term for breaking content
291
+ href ="#ref- CSS3COL " rel =biblioentry > [CSS3COL]<!--{{CSS3COL}}--> </ a > create
292
+ a similarly fragmented environment. The generic term for breaking content
292
293
across containers is < dfn id =fragmentation > fragmentation</ dfn > . This
293
294
module explains how content breaks across < a
294
295
href ="#fragmentation-container "> < i > fragmentation containers</ i > </ a > (< a
@@ -299,23 +300,23 @@ <h2 id=intro><span class=secno>1. </span> Introduction</h2>
299
300
< h3 id =placement > < span class =secno > 1.1. </ span > Module Interactions</ h3 >
300
301
301
302
< p > This module replaces and extends the pagination controls defined in < a
302
- href ="#CSS21 " rel =biblioentry > [CSS21]<!--{{CSS21}}--> </ a > < a
303
+ href ="#ref- CSS21 " rel =biblioentry > [CSS21]<!--{{CSS21}}--> </ a > < a
303
304
href ="http://www.w3.org/TR/CSS21/page.html#page-breaks "> section 13.3</ a >
304
- and in < a href ="#CSS3PAGE "
305
+ and in < a href ="#ref- CSS3PAGE "
305
306
rel =biblioentry > [CSS3PAGE]<!--{{CSS3PAGE}}--> </ a > .</ p >
306
307
<!-- End section "Modules Interactions" -->
307
308
308
309
< h3 id =values > < span class =secno > 1.2. </ span > Values</ h3 >
309
310
310
311
< p > This specification follows the < a
311
312
href ="http://www.w3.org/TR/CSS21/about.html#property-defs "> CSS property
312
- definition conventions</ a > from < a href ="#CSS21 "
313
+ definition conventions</ a > from < a href ="#ref- CSS21 "
313
314
rel =biblioentry > [CSS21]<!--{{!CSS21}}--> </ a > . Value types not defined in
314
- this specification are defined in CSS Level 2 Revision 1 < a href =" #CSS21 "
315
- rel =biblioentry > [CSS21]<!--{{!CSS21}}--> </ a > . Other CSS modules may expand
316
- the definitions of these value types: for example [[CSS-VALUES]], when
317
- combined with this module, adds the ‘< code class = css > initial </ code > ’
318
- value to the properties defined here.
315
+ this specification are defined in CSS Level 2 Revision 1 < a
316
+ href =" #ref-CSS21 " rel =biblioentry > [CSS21]<!--{{!CSS21}}--> </ a > . Other CSS
317
+ modules may expand the definitions of these value types: for example
318
+ [[CSS-VALUES]], when combined with this module, adds the ‘< code
319
+ class = css > initial </ code > ’ value to the properties defined here.
319
320
320
321
< p > In addition to the property-specific values listed in their
321
322
definitions, all properties defined in this specification also accept the
@@ -412,9 +413,9 @@ <h2 id=fragmentation-model><span class=secno>2. </span> Fragmentation Model
412
413
href ="http://www.w3.org/TR/CSS21/visuren.html#inline-boxes "> inline
413
414
boxes</ a > across < a
414
415
href ="http://www.w3.org/TR/CSS21/visuren.html#line-box "> line boxes</ a > .
415
- However, inline breaking is not covered here; see < a href ="#CSS3TEXT "
416
+ However, inline breaking is not covered here; see < a href ="#ref- CSS3TEXT "
416
417
rel =biblioentry > [CSS3TEXT]<!--{{CSS3TEXT}}--> </ a > and the
417
- ’box-decoration-break' property in < a href ="#CSS3BG "
418
+ ’box-decoration-break' property in < a href ="#ref- CSS3BG "
418
419
rel =biblioentry > [CSS3BG]<!--{{CSS3BG}}--> </ a > .
419
420
420
421
< h2 id =breaking-controls > < span class =secno > 3. </ span > Controlling Breaks</ h2 >
@@ -765,9 +766,10 @@ <h3 id=page-break-properties><span class=secno>3.4. </span> Page Break
765
766
766
767
< p > For compatibility with < a
767
768
href ="http://www.w3.org/TR/CSS21/page.html "> CSS Level 2</ a > , UAs that
768
- conform to < a href ="#CSS21 " rel =biblioentry > [CSS21]<!--{{!CSS21}}--> </ a >
769
- must alias the ‘< code class =property > page-break-before</ code > ’,
770
- ‘< code class =property > page-break-after</ code > ’, and ‘< code
769
+ conform to < a href ="#ref-CSS21 "
770
+ rel =biblioentry > [CSS21]<!--{{!CSS21}}--> </ a > must alias the ‘< code
771
+ class =property > page-break-before</ code > ’, ‘< code
772
+ class =property > page-break-after</ code > ’, and ‘< code
771
773
class =property > page-break-inside</ code > ’ properties to ‘< a
772
774
href ="#break-before "> < code class =property > break-before</ code > </ a > ’,
773
775
‘< a href ="#break-after "> < code class =property > break-after</ code > </ a > ’,
@@ -806,16 +808,16 @@ <h2 id=breaking-rules><span class=secno>4. </span> Rules for Breaking</h2>
806
808
807
809
< p > Some content is not fragmentable, for example many types of < a
808
810
href ="http://www.w3.org/TR/CSS21/conform.html#replaced-element "> replaced
809
- elements</ a > < a href ="#CSS21 " rel = biblioentry > [CSS21] <!--{{! CSS21}}--> </ a >
810
- (such as images or video), scrollable elements, or a single line of text
811
- content. Such content is considered < dfn id = monolithic > monolithic </ dfn > :
812
- it contains no possible break points. In addition to any content which is
813
- not fragmentable, UAs may consider as < a
814
- href ="#monolithic "> < i > monolithic</ i > </ a > any elements with ‘ < code
815
- class =property > overflow</ code > ’ set to ‘< code class = css > auto </ code > ’
816
- or ‘< code class =css > scroll</ code > ’ and any elements with ‘ < code
817
- class =css > overflow: hidden</ code > ’ and a non-‘ < code
818
- class =css > auto</ code > ’ < a
811
+ elements</ a > < a href ="#ref- CSS21 "
812
+ rel = biblioentry > [CSS21] <!--{{!CSS21}}--> </ a > (such as images or video),
813
+ scrollable elements, or a single line of text content. Such content is
814
+ considered < dfn id = monolithic > monolithic </ dfn > : it contains no possible
815
+ break points. In addition to any content which is not fragmentable, UAs
816
+ may consider as < a href ="#monolithic "> < i > monolithic</ i > </ a > any elements
817
+ with ‘ < code class =property > overflow</ code > ’ set to ‘< code
818
+ class = css > auto </ code > ’ or ‘< code class =css > scroll</ code > ’ and any
819
+ elements with ‘ < code class =css > overflow: hidden</ code > ’ and a
820
+ non-‘ < code class =css > auto</ code > ’ < a
819
821
href ="http://www.w3.org/TR/css3-writing-modes/#extent "> logical height</ a >
820
822
(and no specified maximum logical height).
821
823
@@ -873,7 +875,7 @@ <h3 id=possible-breaks><span class=secno>4.1. </span> Possible Break Points</h3>
873
875
to avoid losing content off the edge of the page.
874
876
875
877
< p class =note > Other layout models may add breakpoints to the above
876
- classes. For example, < a href ="#CSS3-FLEXBOX "
878
+ classes. For example, < a href ="#ref- CSS3-FLEXBOX "
877
879
rel =biblioentry > [CSS3-FLEXBOX]<!--{{CSS3-FLEXBOX}}--> </ a > adds certain
878
880
points within a flex formatting context to classes A and C.
879
881
@@ -887,13 +889,13 @@ <h3 id=break-types><span class=secno>4.2. </span> Types of Breaks</h3>
887
889
888
890
< dd > A break between two < a
889
891
href ="http://www.w3.org/TR/css3-page/#page-box "> page boxes</ a > . < a
890
- href ="#CSS3PAGE " rel =biblioentry > [CSS3PAGE]<!--{{!CSS3PAGE}}--> </ a >
892
+ href ="#ref- CSS3PAGE " rel =biblioentry > [CSS3PAGE]<!--{{!CSS3PAGE}}--> </ a >
891
893
892
894
< dt > < dfn id =spread-break > spread break</ dfn >
893
895
894
896
< dd > A break between two page boxes that are not associated with < a
895
897
href ="http://www.w3.org/TR/css3-page/#facing-pages "> facing pages</ a > . A
896
- spread break is always also a page break. < a href ="#CSS3PAGE "
898
+ spread break is always also a page break. < a href ="#ref- CSS3PAGE "
897
899
rel =biblioentry > [CSS3PAGE]<!--{{!CSS3PAGE}}--> </ a >
898
900
899
901
< dt > < dfn id =column-break > column break</ dfn >
@@ -903,22 +905,22 @@ <h3 id=break-types><span class=secno>4.2. </span> Types of Breaks</h3>
903
905
Note that if the column boxes are on different pages, then the break is
904
906
also a < a href ="#page-break "> < i > page break</ i > </ a > . Similarly, if the
905
907
column boxes are in different regions, then the break is also a < a
906
- href ="#region-break "> < i > region break</ i > </ a > . < a href ="#CSS3COL "
908
+ href ="#region-break "> < i > region break</ i > </ a > . < a href ="#ref- CSS3COL "
907
909
rel =biblioentry > [CSS3COL]<!--{{!CSS3COL}}--> </ a >
908
910
909
911
< dt > < dfn id =region-break > region break</ dfn >
910
912
911
913
< dd > A break between two < a
912
914
href ="http://www.w3.org/TR/css3-regions/#regions "> regions</ a > . Note that
913
915
if the region boxes are on different pages, then the break is also a < a
914
- href ="#page-break "> < i > page break</ i > </ a > . < a href ="#CSS3-REGIONS "
916
+ href ="#page-break "> < i > page break</ i > </ a > . < a href ="#ref- CSS3-REGIONS "
915
917
rel =biblioentry > [CSS3-REGIONS]<!--{{!CSS3-REGIONS}}--> </ a >
916
918
</ dl >
917
919
918
920
< p class =note > A fifth type of break is the < dfn id =line-break > line
919
921
break</ dfn > , which is a break between two < a
920
922
href ="http://www.w3.org/TR/CSS21/visuren.html#line-box "> line boxes</ a > .
921
- These are not covered in this specification; see < a href ="#CSS21 "
923
+ These are not covered in this specification; see < a href ="#ref- CSS21 "
922
924
rel =biblioentry > [CSS21]<!--{{!CSS21}}--> </ a > .
923
925
924
926
< h3 id =forced-breaks > < span class =secno > 4.3. </ span > Forced Breaks</ h3 >
@@ -948,7 +950,7 @@ <h3 id=forced-breaks><span class=secno>4.3. </span> Forced Breaks</h3>
948
950
< p class =note > A page break must also occur at a < a
949
951
href ="#btw-blocks "> class A break point</ a > if the last line box above this
950
952
margin and the first one below it do not have the same value for ‘< code
951
- class =property > page</ code > ’. See < a href ="#CSS3PAGE "
953
+ class =property > page</ code > ’. See < a href ="#ref- CSS3PAGE "
952
954
rel =biblioentry > [CSS3PAGE]<!--{{!CSS3PAGE}}--> </ a >
953
955
954
956
< p > When a forced break occurs, it forces ensuing content into the next
@@ -1076,7 +1078,7 @@ <h3 id=best-breaks><span class=secno>4.5. </span> Optimizing Unforced
1076
1078
< h2 id =breaking-boxes > < span class =secno > 5. </ span > Box Model for Breaking</ h2 >
1077
1079
1078
1080
< p class =note > The sizing terminology used in this section is defined in < a
1079
- href ="#CSS3-SIZING "
1081
+ href ="#ref- CSS3-SIZING "
1080
1082
rel =biblioentry > [CSS3-SIZING]<!--{{CSS3-SIZING}}--> </ a > .
1081
1083
1082
1084
< h3 id =varying-size-boxes > < span class =secno > 5.1. </ span > Breaking into
@@ -1214,7 +1216,7 @@ <h3 id=break-decoration><span class=secno>5.3. </span> Splitting Boxes at
1214
1216
< p > Where a break splits a box, the ‘< code
1215
1217
class =property > box-decoration-break</ code > ’ property controls whether
1216
1218
the box's margins, borders, padding, and other decorations wrap the
1217
- resulting fragments where the split occurs. < a href ="#CSS3BG "
1219
+ resulting fragments where the split occurs. < a href ="#ref- CSS3BG "
1218
1220
rel =biblioentry > [CSS3BG]<!--{{!CSS3BG}}--> </ a >
1219
1221
1220
1222
< p class =issue > Move ‘< code class =property > box-decoration-break</ code > ’
@@ -1262,9 +1264,9 @@ <h3 id=transforms><span class=secno>5.4. </span> Transforms, Positioning,
1262
1264
and Pagination</ h3 >
1263
1265
1264
1266
< p > Fragmentation interacts with layout, and thus occurs < em > before</ em >
1265
- relative positioning < a href ="#CSS21 "
1267
+ relative positioning < a href ="#ref- CSS21 "
1266
1268
rel =biblioentry > [CSS21]<!--{{!CSS21}}--> </ a > , transforms < a
1267
- href ="#CSS3-TRANSFORMS "
1269
+ href ="#ref- CSS3-TRANSFORMS "
1268
1270
rel =biblioentry > [CSS3-TRANSFORMS]<!--{{!CSS3-TRANSFORMS}}--> </ a > , and any
1269
1271
other graphical effects. However, the separation and transfer of page
1270
1272
boxes < em > should</ em > occur last; thus a transformed fragment that spans
@@ -1297,7 +1299,7 @@ <h3 id=conventions><span class=secno>6.1. </span> Document Conventions</h3>
1297
1299
1298
1300
< p > All of the text of this specification is normative except sections
1299
1301
explicitly marked as non-normative, examples, and notes. < a
1300
- href ="#RFC2119 " rel =biblioentry > [RFC2119]<!--{{!RFC2119}}--> </ a >
1302
+ href ="#ref- RFC2119 " rel =biblioentry > [RFC2119]<!--{{!RFC2119}}--> </ a >
1301
1303
1302
1304
< p > Examples in this specification are introduced with the words “for
1303
1305
example” or are set apart from the normative text with
@@ -1487,7 +1489,7 @@ <h2 class=no-num id=acknowledgments> Acknowledgments</h2>
1487
1489
1488
1490
< p > The editors would like to thank Michael Day, Alex Mogilevsky, and
1489
1491
Florian Rivoal for their contributions to this module. Special thanks go
1490
- to the former < a href ="#CSS3PAGE "
1492
+ to the former < a href ="#ref- CSS3PAGE "
1491
1493
rel =biblioentry > [CSS3PAGE]<!--{{CSS3PAGE}}--> </ a > editors Jim Bigelow
1492
1494
(HP), Melinda Grant (HP), Håkon Wium Lie (Opera), and Jacob Refstrup (HP)
1493
1495
for their contributions to this specification, which is a successor of
@@ -1503,7 +1505,7 @@ <h3 class=no-num id=normative-references>Normative references</h3>
1503
1505
< dd style ="display: none "> <!-- keeps the doc valid if the DL is empty -->
1504
1506
<!---->
1505
1507
1506
- < dt id =CSS21 > [CSS21]
1508
+ < dt id =ref- CSS21> [CSS21]
1507
1509
1508
1510
< dd > Bert Bos; et al. < a
1509
1511
href ="http://www.w3.org/TR/2011/REC-CSS2-20110607 "> < cite > Cascading Style
@@ -1513,7 +1515,7 @@ <h3 class=no-num id=normative-references>Normative references</h3>
1513
1515
</ dd >
1514
1516
<!---->
1515
1517
1516
- < dt id =CSS3-REGIONS > [CSS3-REGIONS]
1518
+ < dt id =ref- CSS3-REGIONS> [CSS3-REGIONS]
1517
1519
1518
1520
< dd > Vincent Hardy; Rossen Atanassov; Alan Stearns. < a
1519
1521
href ="http://www.w3.org/TR/2013/WD-css3-regions-20130528/ "> < cite > CSS
@@ -1523,7 +1525,7 @@ <h3 class=no-num id=normative-references>Normative references</h3>
1523
1525
</ dd >
1524
1526
<!---->
1525
1527
1526
- < dt id =CSS3-TRANSFORMS > [CSS3-TRANSFORMS]
1528
+ < dt id =ref- CSS3-TRANSFORMS> [CSS3-TRANSFORMS]
1527
1529
1528
1530
< dd > Simon Fraser; et al. < a
1529
1531
href ="http://www.w3.org/TR/2012/WD-css3-transforms-20120911/ "> < cite > CSS
@@ -1533,7 +1535,7 @@ <h3 class=no-num id=normative-references>Normative references</h3>
1533
1535
</ dd >
1534
1536
<!---->
1535
1537
1536
- < dt id =CSS3BG > [CSS3BG]
1538
+ < dt id =ref- CSS3BG> [CSS3BG]
1537
1539
1538
1540
< dd > Bert Bos; Elika J. Etemad; Brad Kemper. < a
1539
1541
href ="http://www.w3.org/TR/2012/CR-css3-background-20120724/ "> < cite > CSS
@@ -1543,7 +1545,7 @@ <h3 class=no-num id=normative-references>Normative references</h3>
1543
1545
</ dd >
1544
1546
<!---->
1545
1547
1546
- < dt id =CSS3COL > [CSS3COL]
1548
+ < dt id =ref- CSS3COL> [CSS3COL]
1547
1549
1548
1550
< dd > Håkon Wium Lie. < a
1549
1551
href ="http://www.w3.org/TR/2011/CR-css3-multicol-20110412 "> < cite > CSS
@@ -1553,7 +1555,7 @@ <h3 class=no-num id=normative-references>Normative references</h3>
1553
1555
</ dd >
1554
1556
<!---->
1555
1557
1556
- < dt id =CSS3PAGE > [CSS3PAGE]
1558
+ < dt id =ref- CSS3PAGE> [CSS3PAGE]
1557
1559
1558
1560
< dd > Melinda Grant; et al. < a
1559
1561
href ="http://www.w3.org/TR/2013/WD-css3-page-20130314/ "> < cite > CSS Paged
@@ -1563,7 +1565,7 @@ <h3 class=no-num id=normative-references>Normative references</h3>
1563
1565
</ dd >
1564
1566
<!---->
1565
1567
1566
- < dt id =RFC2119 > [RFC2119]
1568
+ < dt id =ref- RFC2119> [RFC2119]
1567
1569
1568
1570
< dd > S. Bradner. < a href ="http://www.ietf.org/rfc/rfc2119.txt "> < cite > Key
1569
1571
words for use in RFCs to Indicate Requirement Levels.</ cite > </ a > Internet
@@ -1582,7 +1584,7 @@ <h3 class=no-num id=other-references>Other references</h3>
1582
1584
< dd style ="display: none "> <!-- keeps the doc valid if the DL is empty -->
1583
1585
<!---->
1584
1586
1585
- < dt id =CSS3-FLEXBOX > [CSS3-FLEXBOX]
1587
+ < dt id =ref- CSS3-FLEXBOX> [CSS3-FLEXBOX]
1586
1588
1587
1589
< dd > Tab Atkins Jr.; Elika J. Etemad; Alex Mogilevsky. < a
1588
1590
href ="http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/ "> < cite > CSS
@@ -1592,7 +1594,7 @@ <h3 class=no-num id=other-references>Other references</h3>
1592
1594
</ dd >
1593
1595
<!---->
1594
1596
1595
- < dt id =CSS3-SIZING > [CSS3-SIZING]
1597
+ < dt id =ref- CSS3-SIZING> [CSS3-SIZING]
1596
1598
1597
1599
< dd > Tab Atkins Jr.; Elika J. Etemad. < a
1598
1600
href ="http://www.w3.org/TR/2012/WD-css3-sizing-20120927/ "> < cite > CSS
@@ -1602,7 +1604,7 @@ <h3 class=no-num id=other-references>Other references</h3>
1602
1604
</ dd >
1603
1605
<!---->
1604
1606
1605
- < dt id =CSS3TEXT > [CSS3TEXT]
1607
+ < dt id =ref- CSS3TEXT> [CSS3TEXT]
1606
1608
1607
1609
< dd > Elika J. Etemad; Koji Ishii. < a
1608
1610
href ="http://www.w3.org/TR/2012/WD-css3-text-20121113/ "> < cite > CSS Text
0 commit comments