FFFF [css-break] Addressing transformed overflow fragmentation issue. · w3c/csswg-drafts@89ca42c · GitHub
Skip to content

Commit 89ca42c

Browse files
author
Rossen Atanassov
committed
[css-break] Addressing transformed overflow fragmentation issue.
--HG-- extra : rebase_source : fd12997937282379218d387cf6665d5b206aa68b
1 parent 9e9986d commit 89ca42c

2 files changed

Lines changed: 84 additions & 60 deletions

File tree

‎css-break/Overview.html‎

Lines changed: 73 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,11 @@
1212
rel=dcterms.rights>
1313
<meta content="CSS Fragmentation Module Level 3" name=dcterms.title>
1414
<meta content=text name=dcterms.type>
15-
<meta content=2014-01-15 name=dcterms.date>
15+
<meta content=2014-10-28 name=dcterms.date>
1616
<meta content="Rossen Atanassov" name=dcterms.creator>
1717
<meta content="Microsoft Corporation" name=dcterms.creator>
1818
<meta
19-
content="<a class=&quot;fn&quot; href=&quot;http://fantasai.inkedblade.net/contact&quot;>Elika J. Etemad</a>"
19+
content="&#60;a class=&quot;fn&quot; href=&quot;http://fantasai.inkedblade.net/contact&quot;&#62;Elika J. Etemad&#60;/a&#62;"
2020
name=dcterms.creator>
2121
<meta content="Mozilla Corporation" name=dcterms.creator>
2222
<meta content=W3C name=dcterms.publisher>
@@ -36,7 +36,7 @@ <h1 id=css-fragmentation-module>CSS Fragmentation Module Level 3</h1>
3636
<h2 class="no-num no-toc" id=subtitle>Breaking the Web, one fragment at a
3737
time</h2>
3838

39-
<h2 class="no-num no-toc">Editor's Draft 15 January 2014</h2>
39+
<h2 class="no-num no-toc">Editor's Draft 28 October 2014</h2>
4040

4141
<dl>
4242
<dt>This version:
@@ -368,6 +368,7 @@ <h2 id=fragmentation-model><span class=secno>2. </span> Fragmentation Model
368368
a <a href="http://www.w3.org/TR/css3-page/">paged media display</a>. A
369369
given fragmentation context can only have one block flow direction across
370370
all its <a href="#fragmentainer"><i>fragmentainers</i></a>.
371+
<!-- XXX clarify that multiple writing modes are allowed, just fragmentationis in one direction -->
371372

372373
<dt><dfn id=fragmented-flow>fragmented flow</dfn>
373374

@@ -422,8 +423,8 @@ <h2 id=fragmentation-model><span class=secno>2. </span> Fragmentation Model
422423
boxes</a> across <a
423424
href="http://www.w3.org/TR/CSS21/visuren.html#line-box">line boxes</a>.
424425
However, inline breaking is not covered here; see <a href="#ref-CSS21"
425-
rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a>/<a href="#ref-CSS3TEXT"
426-
rel=biblioentry>[CSS3TEXT]<!--{{CSS3TEXT}}--></a>.
426+
rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a>/<a href="#ref-CSS-TEXT-3"
427+
rel=biblioentry>[CSS-TEXT-3]<!--{{CSS-TEXT-3}}--></a>.
427428

428429
<h3 id=parallel-flows><span class=secno>2.1. </span> Parallel Fragmentation
429430
Flows</h3>
@@ -457,6 +458,7 @@ <h3 id=parallel-flows><span class=secno>2.1. </span> Parallel Fragmentation
457458
within the context of the box's <a href="#fragmented-flow"><i>fragmented
458459
flow</i></a> following normal fragmentation rules, increasing the length
459460
of the <a href="#fragmented-flow"><i>fragmented flow</i></a> as necessary.
461+
<!-- XXX this paragraph is generally confusing -->
460462

461463
<h3 id=nested-flows><span class=secno>2.2. </span> Nested Fragmentation
462464
Flows</h3>
@@ -921,8 +923,9 @@ <h3 id=possible-breaks><span class=secno>4.1. </span> Possible Break Points</h3>
921923

922924
<dd> When the block flow direction of the siblings' containing block is
923925
parallel to that of the fragmentation context: in-flow block-level
924-
boxes, a float and an immediately-adjacent in-flow or floated box,
925-
table row group boxes, table row boxes, multi-column column row boxes.
926+
boxes, <!-- XXX linkify in-flow --> a float and an immediately-adjacent
927+
in-flow or floated box, table row group boxes, table row boxes,
928+
multi-column column row boxes.
926929

927930
<dt>Block-perpendicular Fragmentation
928931

@@ -940,7 +943,7 @@ <h3 id=possible-breaks><span class=secno>4.1. </span> Possible Break Points</h3>
940943
<dd> Between the content edge of a block container box and the outer edges
941944
of its child content (margin edges of block-level children or line box
942945
edges for inline-level children) <em>if</em> there is a (non-zero) gap
943-
between them.
946+
between them. <!-- XXX add example -->
944947
</dl>
945948

946949
<p class=note> There is no inherent prioritization among these classes of
@@ -959,7 +962,8 @@ <h3 id=possible-breaks><span class=secno>4.1. </span> Possible Break Points</h3>
959962

960963
<p> When paginating, if there are no possible break points below the top of
961964
the page, and not all the content fits, the UA may break anywhere in order
962-
to avoid losing content off the edge of the page.
965+
to avoid losing content off the edge of the page. <span class=issue>Should
966+
this be generalized to fragmentainer?</span>
963967

964968
<p class=note> Other layout models may add breakpoints to the above
965969
classes. For example, <a href="#ref-CSS3-FLEXBOX"
@@ -1008,8 +1012,8 @@ <h3 id=break-types><span class=secno>4.2. </span> Types of Breaks</h3>
10081012
break</dfn>, which is a break between two <a
10091013
href="http://www.w3.org/TR/CSS21/visuren.html#line-box">line boxes</a>.
10101014
These are not covered in this specification; see <a href="#ref-CSS21"
1011-
rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a> <a href="#ref-CSS3TEXT"
1012-
rel=biblioentry>[CSS3TEXT]<!--{{CSS3TEXT}}--></a>.
1015+
rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a> <a href="#ref-CSS-TEXT-3"
1016+
rel=biblioentry>[CSS-TEXT-3]<!--{{CSS-TEXT-3}}--></a>.
10131017

10141018
<h3 id=forced-breaks><span class=secno>4.3. </span> Forced Breaks</h3>
10151019

@@ -1101,6 +1105,11 @@ <h3 id=unforced-breaks><span class=secno>4.4. </span> Unforced Breaks</h3>
11011105
<p> If that still does not lead to sufficient break points, rule 3 is
11021106
dropped as well, to find still more break points.
11031107

1108+
<p class="note issue">This means that ‘<a href="#widows"><code
1109+
class=property>widows</code></a>’ and ‘<a href="#orphans"><code
1110+
class=property>orphans</code></a>’ restrictions are given priority over
1111+
the ‘<code class=css>break-*</code>’ controls.
1112+
11041113
<h3 id=best-breaks><span class=secno>4.5. </span> Optimizing Unforced
11051114
Breaks</h3>
11061115

@@ -1171,7 +1180,8 @@ <h3 id=varying-size-boxes><span class=secno>5.1. </span> Breaking into
11711180
Varying-size Fragmentainers</h3>
11721181

11731182
<p> When a flow is fragmented into varying-size fragmentainers, the
1174-
following rules are observed for adapting layout:
1183+
following rules are observed for adapting layout:</p>
1184+
<!-- try to make this clearer. Steve suggests swapping first two points, maybe break it up more? -->
11751185

11761186
<ul>
11771187
<li> Intrinsic sizes are calculated and maintained across the entire
@@ -1456,8 +1466,8 @@ <h3 id=break-decoration><span class=secno>5.4. </span> Fragmented Borders
14561466
edge. (Note in particular that neither the element's own ‘<code
14571467
class=property>direction</code>’ nor its containing block's ‘<code
14581468
class=property>direction</code>’ is used.) See <a
1459-
href="#ref-CSS3-WRITING-MODES"
1460-
rel=biblioentry>[CSS3-WRITING-MODES]<!--{{CSS3-WRITING-MODES}}--></a>.
1469+
href="#ref-CSS-WRITING-MODES-3"
1470+
rel=biblioentry>[CSS-WRITING-MODES-3]<!--{{CSS-WRITING-MODES-3}}--></a>.
14611471

14621472
<h4 id=joining-boxes><span class=secno>5.4.1. </span> Joining Boxes for
14631473
‘<a href="#slice"><code class=css>slice</code></a>’</h4>
@@ -1522,14 +1532,22 @@ <h3 id=transforms><span class=secno>5.5. </span> Transforms, Positioning,
15221532
other graphical effects. Such effects are applied per fragment: for
15231533
example, rotation applied to a fragmented box will calculate a rotation
15241534
origin for each fragment and independently rotate that fragment around its
1525-
origin. However, the separation and transfer of page boxes <em>should</em>
1526-
occur last; thus a transformed fragment that spans pages <em>should</em>
1527-
be sliced at the page breaks and print in its entirety rather than being
1528-
clipped by its originating page.
1535+
origin. The origin of an overflow-only fragment is determined as if that
1536+
content were overflowing an empty box with zero margins/borders/padding at
1537+
the start of the fragmentainer (see ) However, the separation and transfer
1538+
of page boxes <em>should</em> occur last; thus a transformed fragment that
1539+
spans pages <em>should</em> be sliced at the page breaks and print in its
1540+
entirety rather than being clipped by its originating page.
1541+
1542+
<div class=figure>
1543+
<p><img alt="Illustration: Transformed overflow fragmentation"
1544+
src=fragmented-transforms.png>
15291545

1530-
<p class=issue> There's an issue of how to handle fragments consisting
1531-
entirely of overflowing content. See <a
1532-
href="http://lists.w3.org/Archives/Public/www-style/2013Dec/0471.html">discussion</a>.
1546+
<p class=caption>A fixed-height box spanning 2.5 pages with overflow
1547+
content spanning to a total of 4 pages. The transform origin of each
1548+
fragment is the center of its border box; the fragment without a border
1549+
box assumes a zero-height box at the start of the overflow.
1550+
</div>
15331551

15341552
<p> Absolute positioning affects layout and thus interacts with
15351553
fragmentation. Both the coordinate system and absolutely-positioned boxes
@@ -1781,11 +1799,11 @@ <h3 class=no-num id=normative-references>Normative references</h3>
17811799

17821800
<dt id=ref-CSS3-REGIONS>[CSS3-REGIONS]
17831801

1784-
<dd>Vincent Hardy; Rossen Atanassov; Alan Stearns. <a
1785-
href="http://www.w3.org/TR/2013/WD-css3-regions-20130528/"><cite>CSS
1786-
Regions Module Level 1.</cite></a> 28 May 2013. W3C Working Draft. (Work
1787-
in progress.) URL: <a
1788-
href="http://www.w3.org/TR/2013/WD-css3-regions-20130528/">http://www.w3.org/TR/2013/WD-css3-regions-20130528/</a>
1802+
<dd>Rossen Atanassov; Alan Stearns. <a
1803+
href="http://www.w3.org/TR/2014/WD-css3-regions-20140218/"><cite>CSS
1804+
Regions Module Level 1.</cite></a> 18 February 2014. W3C Working Draft.
1805+
(Work in progress.) URL: <a
1806+
href="http://www.w3.org/TR/2014/WD-css3-regions-20140218/">http://www.w3.org/TR/2014/WD-css3 E3B3 -regions-20140218/</a>
17891807
</dd>
17901808
<!---->
17911809

@@ -1802,10 +1820,10 @@ <h3 class=no-num id=normative-references>Normative references</h3>
18021820
<dt id=ref-CSS3BG>[CSS3BG]
18031821

18041822
<dd>Bert Bos; Elika J. Etemad; Brad Kemper. <a
1805-
href="http://www.w3.org/TR/2012/CR-css3-background-20120724/"><cite>CSS
1806-
Backgrounds and Borders Module Level 3.</cite></a> 24 July 2012. W3C
1823+
href="http://www.w3.org/TR/2014/CR-css3-background-20140909/"><cite>CSS
1824+
Backgrounds and Borders Module Level 3.</cite></a> 9 September 2014. W3C
18071825
Candidate Recommendation. (Work in progress.) URL: <a
1808-
href="http://www.w3.org/TR/2012/CR-css3-background-20120724/">http://www.w3.org/TR/2012/CR-css3-background-20120724/</a>
1826+
href="http://www.w3.org/TR/2014/CR-css3-background-20140909/">http://www.w3.org/TR/2014/CR-css3-background-20140909/</a>
18091827
</dd>
18101828
<!---->
18111829

@@ -1832,8 +1850,8 @@ <h3 class=no-num id=normative-references>Normative references</h3>
18321850
<dt id=ref-RFC2119>[RFC2119]
18331851

18341852
<dd>S. Bradner. <a href="http://www.ietf.org/rfc/rfc2119.txt"><cite>Key
1835-
words for use in RFCs to Indicate Requirement Levels.</cite></a> Internet
1836-
RFC 2119. URL: <a
1853+
words for use in RFCs to Indicate Requirement Levels.</cite></a> RFC
1854+
2119. URL: <a
18371855
href="http://www.ietf.org/rfc/rfc2119.txt">http://www.ietf.org/rfc/rfc2119.txt</a>
18381856
</dd>
18391857
<!---->
@@ -1848,43 +1866,43 @@ <h3 class=no-num id=other-references>Other references</h3>
18481866
<dd style="display: none"><!-- keeps the doc valid if the DL is empty -->
18491867
<!---->
18501868

1851-
<dt id=ref-CSS3-FLEXBOX>[CSS3-FLEXBOX]
1869+
<dt id=ref-CSS-TEXT-3>[CSS-TEXT-3]
18521870

1853-
<dd>Tab Atkins Jr.; Elika J. Etemad; Alex Mogilevsky. <a
1854-
href="http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/"><cite>CSS
1855-
Flexible Box Layout Module.</cite></a> 18 September 2012. W3C Candidate
1856-
Recommendation. (Work in progress.) URL: <a
1857-
href="http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/">http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/</a>
1871+
<dd>Elika J. Etemad; Koji Ishii. <a
1872+
href="http://www.w3.org/TR/2013/WD-css-text-3-20131010/"><cite>CSS Text
1873+
Module Level 3.</cite></a> 10 October 2013. W3C Last Call Working Draft.
1874+
(Work in progress.) URL: <a
1875+
href="http://www.w3.org/TR/2013/WD-css-text-3-20131010/">http://www.w3.org/TR/2013/WD-css-text-3-20131010/</a>
18581876
</dd>
18591877
<!---->
18601878

1861-
<dt id=ref-CSS3-SIZING>[CSS3-SIZING]
1879+
<dt id=ref-CSS-WRITING-MODES-3>[CSS-WRITING-MODES-3]
18621880

1863-
<dd>Tab Atkins Jr.; Elika J. Etemad. <a
1864-
href="http://www.w3.org/TR/2012/WD-css3-sizing-20120927/"><cite>CSS
1865-
Intrinsic &amp; Extrinsic Sizing Module Level 3.</cite></a> 27 September
1866-
2012. W3C Working Draft. (Work in progress.) URL: <a
1867-
href="http://www.w3.org/TR/2012/WD-css3-sizing-20120927/">http://www.w3.org/TR/2012/WD-css3-sizing-20120927/</a>
1881+
<dd>fantasai; Koji Ishii. <a
1882+
href="http://www.w3.org/TR/2014/CR-css-writing-modes-3-20140320/"><cite>CSS
1883+
Writing Modes Level 3.</cite></a> 20 March 2014. W3C Candidate
1884+
Recommendation. (Work in progress.) URL: <a
1885+
href="http://www.w3.org/TR/2014/CR-css-writing-modes-3-20140320/">http://www.w3.org/TR/2014/CR-css-writing-modes-3-20140320/</a>
18681886
</dd>
18691887
<!---->
18701888

1871-
<dt id=ref-CSS3-WRITING-MODES>[CSS3-WRITING-MODES]
1889+
<dt id=ref-CSS3-FLEXBOX>[CSS3-FLEXBOX]
18721890

1873-
<dd>Elika J. Etemad; Koji Ishii. <a
1874-
href="http://www.w3.org/TR/2012/WD-css3-writing-modes-20121115/"><cite>CSS
1875-
Writing Modes Module Level 3.</cite></a> 15 November 2012. W3C Working
1876-
Draft. (Work in progress.) URL: <a
1877-
href="http://www.w3.org/TR/2012/WD-css3-writing-modes-20121115/">http://www.w3.org/TR/2012/WD-css3-writing-modes-20121115/</a>
1891+
<dd>Tab Atkins Jr.; fantasai; Rossen Atanassov. <a
1892+
href="http://www.w3.org/TR/2014/WD-css-flexbox-1-20140325/"><cite>CSS
1893+
Flexible Box Layout Module Level 1.</cite></a> 25 March 2014. W3C Last
1894+
Call Working Draft. (Work in progress.) URL: <a
1895+
href="http://www.w3.org/TR/2014/WD-css-flexbox-1-20140325/">http://www.w3.org/TR/2014/WD-css-flexbox-1-20140325/</a>
18781896
</dd>
18791897
<!---->
18801898

1881-
<dt id=ref-CSS3TEXT>[CSS3TEXT]
1899+
<dt id=ref-CSS3-SIZING>[CSS3-SIZING]
18821900

1883-
<dd>Elika J. Etemad; Koji Ishii. <a
1884-
href="http://www.w3.org/TR/2012/WD-css3-text-20121113/"><cite>CSS Text
1885-
Module Level 3.</cite></a> 13 November 2012. W3C Working Draft. (Work in
1886-
progress.) URL: <a
1887-
href="http://www.w3.org/TR/2012/WD-css3-text-20121113/">http://www.w3.org/TR/2012/WD-css3-text-20121113/</a>
1901+
<dd>Tab Atkins Jr.; Elika J. Etemad. <a
1902+
href="http://www.w3.org/TR/2012/WD-css3-sizing-20120927/"><cite>CSS
1903+
Intrinsic &amp; Extrinsic Sizing Module Level 3.</cite></a> 27 September
1904+
2012. W3C Working Draft. (Work in progress.) URL: <a
1905+
href="http://www.w3.org/TR/2012/WD-css3-sizing-20120927/">http://www.w3.org/TR/2012/WD-css3-sizing-20120927/</a>
18881906
</dd>
18891907
<!---->
18901908

‎css-break/Overview.src.html‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1203,16 +1203,22 @@ <h3 id="transforms">
12031203
for example, rotation applied to a fragmented box
12041204
will calculate a rotation origin for each fragment
12051205
and independently rotate that fragment around its origin.
1206-
(The origin of an overflow-only fragment is determined
1207-
as if that content were overflowing an empty box with zero margins/borders/padding at the start of the fragmentainer.)
1206+
The origin of an overflow-only fragment is determined
1207+
as if that content were overflowing an empty box with zero margins/borders/padding
1208+
at the start of the fragmentainer (see )
12081209
However, the separation and transfer of page boxes <em>should</em> occur last;
12091210
thus a transformed fragment that spans pages <em>should</em>
12101211
be sliced at the page breaks and print in its entirety
12111212
rather than being clipped by its originating page.
73AF 12121213

1213-
<p class="issue">
1214-
There's an issue of how to handle fragments consisting entirely of overflowing content.
1215-
See <a href="http://lists.w3.org/Archives/Public/www-style/2013Dec/0471.html">discussion</a>.
1214+
<div class="figure">
1215+
<p><img alt="Illustration: Transformed overflow fragmentation"
1216+
src="fragmented-transforms.png">
1217+
<p class=caption>A fixed-height box spanning 2.5 pages with overflow content spanning
1218+
to a total of 4 pages.
1219+
The transform origin of each fragment is the center of its border box;
1220+
the fragment without a border box assumes a zero-height box at the start of the overflow.
1221+
</div>
12161222

12171223
<p>
12181224
Absolute positioning affects layout and thus interacts with fragmentation.

0 commit comments

Comments
 (0)