FFFF [css-overflow] Detail how the computed value of 'continue' works · w3c/csswg-drafts@7b83477 · GitHub
Skip to content

Commit 7b83477

Browse files
committed
[css-overflow] Detail how the computed value of 'continue' works
In the process of doing that, I also realised that ''next'' and ''auto'' were identical, so I merged them.
1 parent 32fa483 commit 7b83477

2 files changed

Lines changed: 194 additions & 107 deletions

File tree

css-overflow/Overview.bs

Lines changed: 48 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -466,10 +466,19 @@ Introduction</h2>
466466

467467
<h2 id="fragmentation">Fragmentation of overflow</h2>
468468

469+
The 'continue' property gives authors the ability
470+
to request that content that does not fit inside an element
471+
be fragmented (in the sense of [[!CSS3-BREAK]]),
472+
and provides alternatives
473+
for where the remaining content should continue.
474+
475+
Notably, this property explains traditional pagination,
476+
and extends it further.
477+
469478
<pre class=propdef>
470479
Name: continue
471-
Value: ''auto'' | ''overflow'' | ''paginate'' | ''fragments'' | ''discard'' | ''next''
472-
Initial: ''auto''
480+
Value: ''next'' | ''overflow'' | ''paginate'' | ''fragments'' | ''discard''
481+
Initial: next
473482
Applies to: block containers [[!CSS21]], flex containers [[!CSS3-FLEXBOX]], and grid containers [[!CSS3-GRID-LAYOUT]]
474483
Inherited: no
475484
Percentages: N/A
@@ -479,21 +488,19 @@ Introduction</h2>
479488
Canonical order: <abbr title="follows order of property value definition">per grammar</abbr>
480489
</pre>
481490

482-
Issue: Naming is preliminary.
483-
This was initially proposed as
484-
"fragmentation: auto | none | break | clone | page"
485-
in <a href="https://lists.w3.org/Archives/Public/www-style/2015Jan/0357.html">https://lists.w3.org/Archives/Public/www-style/2015Jan/0357.html</a>
486491

487492
Note: ''continue: fragments'' replaces "overflow:fragments"
488493
from earlier versions of this specification,
489494
while ''continue: paginate'' replaces "overflow: paged-x | paged-y | paged-x-controls | paged-y-controls"
490495

491-
Issue: The definitions below are vaguely worded, and need to be more specific.
492-
493496
<dl dfn-for="continue" dfn-type="value">
494-
<dt><dfn>auto</dfn>
495-
<dd>Behavior varies between the other values, depending on contex.
496-
See the section below on computed values for details.
497+
<dt><dfn>next</dfn>
498+
<dd>Content that doesn't fit is pushed to the next region
499+
if the element is a <a spec="css-regions">CSS Region</a>
500+
other than the last one in a <a spec="css-regions">region chain</a>,
501+
or to the next page if the element is part of a page chain,
502+
or to the next <a>fragment box</a> if the element is a <a>fragment box</a>
503+
Otherwise, it overflows.
497504

498505
<dt><dfn>overflow</dfn>
499506
<dd>Content that doesn't fit overflows, according to the 'overflow' property
@@ -502,36 +509,50 @@ Issue: The definitions below are vaguely worded, and need to be more specific.
502509
<dd>Content that doesn't fit is discarded at a fragmentation break
503510

504511
Note: generalized from region-fragment: break; on the last region of a region chain
505-
<dt><dfn>next</dfn>
506-
<dd>Content that doesn't fit is pushed to the next region
507-
if the element is part of a region chain,
508-
or to the next page if the element is part of a page chain. If
509-
there isn't a next region or page, it overflows.
510512

511-
Note: Behavior could have been to discard
512-
but discarding anything should be a very explicit behavior
513+
Issue: When the element isn't a <a spec="css-break">fragmentation container</a> already,
514+
should this work by turning it directly into one,
515+
or by creating a <a>fragment box</a> inside it like ''continue/fragments'' does?
513516

514517
<dt><dfn>paginate</dfn>
515518
<dd>Content that doesn't fit paginates.
516519
This creates a paginated view inside the element
517520
similar to the way that 'overflow: scroll' creates a scrollable view.
518521

519-
Pages can be styled with @page rules.
522+
See <a href="#paginated-overflow">paginated overflow</a>
520523

521524
Note: Print is effectively "continue: paginate" on the root.
522-
523-
See <a href="#paginated-overflow">paginated overflow</a>
524525
<dt><dfn>fragments</dfn>
525526
<dd>content that doesn't fit causes the element to copy itself and continue laying out.
527+
526528
See <a href="#fragment-overflow">fragment overflow</a>.
527529
</dl>
528530

529-
Issue: There is some overlap between overflow, discard and next.
530-
Only 2 of the 3 ever make sense in any situation,
531-
even though it isn't always the same two.
532-
It may be possible to reduce this to 2 values.
533-
An earlier proposal combined discard and next into break,
534-
although this had the downside of making discard a non explicit behavior.
531+
The computed value of the 'continue' for a given element or pseudo element is determined as follow:
532+
<ol>
533+
<li>If the specified value is ''continue/next''
534+
<ol>
535+
<li>On a <a spec="css-regions">CSS Region</a> other than the last one in a <a spec="css-regions">region chain</a>,
536+
the computed value is ''continue/next''
537+
<li>On a page
538+
the computed value is ''continue/paginate''
539+
<li>On a <a>fragment box</a>
540+
the computed value is ''continue/fragments''
541+
<li>Otherwise, the computed value is 'continue/overflow''
542+
</ol>
543+
<li>If the specified value is ''continue/framgents''
544+
<ol>
545+
<li>On a page
546+
the computed value is ''continue/paginate''
547+
<li>Otherwise, the computed value is the specified value
548+
</ol>
549+
<li>In all other cases, the computed value is the specified value
550+
</ 666F ol>
551+
552+
Issue: The naming of this property and its values is preliminary.
553+
This was initially proposed as
554+
"fragmentation: auto | none | break | clone | page"
555+
in <a href="https://lists.w3.org/Archives/Public/www-style/2015Jan/0357.html">https://lists.w3.org/Archives/Public/www-style/2015Jan/0357.html</a>.
535556

536557
Note: For background discussions leading to this property, see these threads:
537558
<a href="http://lists.w3.org/Archives/Public/www-style/2012May/1197.html">discussion of overflow, overflow-x, overflow-y and overflow-style</a> and

0 commit comments

Comments
 (0)