Skip to content

Commit 6f23af9

Browse files
committed
[css-overflow] Removing the fragmenting values from 'overflow'
We have resolved to move the fragmenting values from the overflow property into a new one. This cleans up the overflow section in preparation of this. Note that the sections about fragments and pagination have not yet been update to reflect this.
1 parent 7d1be30 commit 6f23af9

File tree

2 files changed

+281
-288
lines changed

2 files changed

+281
-288
lines changed

css-overflow/Overview.bs

+53-82
Original file line numberDiff line numberDiff line change
@@ -380,7 +380,7 @@ Introduction</h2>
380380

381381
<pre class=propdef>
382382
Name: overflow-x, overflow-y
383-
Value: ''visible'' | ''hidden'' | ''scroll'' | ''auto'' | ''paged-x'' | ''paged-y'' | ''paged-x-controls'' | ''paged-y-controls'' | ''fragments''
383+
Value: ''visible'' | ''hidden'' | ''scroll'' | ''auto''
384384
Initial: ''visible''
385385
Applies to: block containers [[!CSS21]], flex containers [[!CSS3-FLEXBOX]], and grid containers [[!CSS3-GRID-LAYOUT]]
386386
Inherited: no
@@ -399,7 +399,7 @@ Introduction</h2>
399399

400400
<pre class=propdef>
401401
Name: overflow
402-
Value: ''visible'' | ''hidden'' | ''scroll'' | ''auto'' | ''paged-x'' | ''paged-y'' | ''paged-x-controls'' | ''paged-y-controls'' | ''fragments''
402+
Value: ''visible'' | ''hidden'' | ''scroll'' | ''auto''
403403
Initial: see individual properties
404404
Applies to: block containers [[!CSS21]], flex containers [[!CSS3-FLEXBOX]], and grid containers [[!CSS3-GRID-LAYOUT]]
405405
Inherited: no
@@ -410,73 +410,15 @@ Introduction</h2>
410410
Canonical order: <abbr title="follows order of property value definition">per grammar</abbr>
411411
</pre>
412412

413-
<p>The values of these properties are:</p>
414-
415-
<dl dfn-for="overflow" dfn-type="value">
416-
<dt><dfn>visible</dfn>
417-
<dd>
418-
There is no special handling of overflow, that is, it
419-
may be rendered outside the block container.
420-
</dd>
421-
<dt><dfn>hidden</dfn>
422-
<dt><dfn>scroll</dfn>
423-
<dt><dfn>auto</dfn>
424-
<dd>
425-
These values are collectively the <dfn dfn>scrolling values</dfn>;
426-
they are defined in the section on
427-
<a href="#scrolling-overflow">scrolling and hidden overflow</a>.
428-
</dd>
429-
<dt><dfn>paged-x</dfn>
430-
<dt><dfn>paged-y</dfn>
431-
<dt><dfn>paged-x-controls</dfn>
432-
<dt><dfn>paged-y-controls</dfn>
433-
<dt><dfn>fragments</dfn>
434-
<dd>
435-
These values are collectively the <dfn dfn>fragmenting values</dfn>;
436-
they are defined in the sections on
437-
<a href="#paginated-overflow">paginated overflow</a> and
438-
<a href="#fragment-overflow">fragment overflow</a>.
439-
</dd>
440-
</dl>
441-
442413
<div id="overflow-computed-values">
443414
<p>The computed values of 'overflow-x' and 'overflow-y'
444415
are determined from the cascaded values [[!CSS3CASCADE]]
445416
based on the following rules:</p>
446417

447418
<ol>
448419
<li>
449-
If one or both of the cascaded values are
450-
<a>fragmenting values</a>, then:
451-
<ol>
452-
<li>
453-
If one of the cascaded values is one of the
454-
<a>fragmenting values</a>
455-
and the other is not,
456-
then the computed values are
457-
the same as the cascaded values.
458-
</li>
459-
<li>
460-
If both of the cascaded values are <a>fragmenting values</a>, then:
461-
<ol>
462-
<li>
463-
for horizontal writing mode [[!CSS3-WRITING-MODES]],
464-
the computed value for 'overflow-y' is the cascaded value
465-
and the computed value for 'overflow-x' is ''overflow/hidden'', or
466-
</li>
467-
<li>
468-
for vertical writing mode [[!CSS3-WRITING-MODES]],
469-
the computed value for 'overflow-x' is the cascaded value
470-
and the computed value for 'overflow-y' is ''overflow/hidden''.
471-
</li>
472-
</ol>
473-
</li>
474-
</ol>
475-
</li>
476-
<li>
477-
Otherwise, if one cascaded values is
478-
one of the <a>scrolling values</a>
479-
and the other is ''overflow/visible'',
420+
If one cascaded values is ''overflow/visible''
421+
and the other is not,
480422
then computed values are the cascaded values
481423
with ''overflow/visible'' changed to ''overflow/auto''.
482424
</li>
@@ -486,17 +428,30 @@ Introduction</h2>
486428
</ol>
487429
</div>
488430

431+
<p>The values of these properties are:</p>
432+
433+
<dl dfn-for="overflow" dfn-type="value">
434+
<dt><dfn>visible</dfn>
435+
<dd>
436+
There is no special handling of overflow, that is, it
437+
may be rendered outside the block container.
438+
</dd>
439+
<dt><dfn>hidden</dfn>
440+
<dt><dfn>scroll</dfn>
441+
<dt><dfn>auto</dfn>
442+
<dd>
443+
<p class="issue">
444+
Move material from [[CSS21]] and [[CSS3BOX]] here.
445+
</p>
446+
</dd>
447+
</dl>
448+
489449
<p class="issue">
490-
Are all 4 of the ''paged-*'' values really needed?
450+
Explain which directions allow scrolling and which don't,
451+
as a function of 'direction'
452+
(including propagation of 'direction' to the ICB).
491453
</p>
492454

493-
<p>
494-
When the <a>fragmenting values</a> are used,
495-
the overflow from the fragments themselves
496-
treats the fragmenting value as ''overflow/hidden''.
497-
<span class="issue">Is this the right behavior?</span>
498-
<span class="issue">Give example.</span>
499-
</p>
500455

501456
<p class="issue">
502457
[[CSS3-MARQUEE]] describes an 'overflow-style' property,
@@ -509,27 +464,43 @@ Introduction</h2>
509464
'overflow-x' and 'overflow-y' instead?
510465
</p>
511466

467+
<h2 id="fragmentation-properties">Fragmentation properties</h2>
468+
469+
Issue: This section is a WIP, and currently just holds bits of information that need to be massaged into proper form.
470+
471+
| ''paged-x'' | ''paged-y'' | ''paged-x-controls'' | ''paged-y-controls'' | ''fragments''
472+
512473
<p class="issue">
474+
Are all 4 of the ''paged-*'' values really needed?
475+
</p>
476+
477+
<dl>
478+
<dt><dfn>paged-x</dfn>
479+
<dt><dfn>paged-y</dfn>
480+
<dt><dfn>paged-x-controls</dfn>
481+
<dt><dfn>paged-y-controls</dfn>
482+
<dt><dfn>fragments</dfn>
483+
<dd>
484+
These values are collectively the <dfn dfn>fragmenting values</dfn>;
485+
they are defined in the sections on
486+
<a href="#paginated-overflow">paginated overflow</a> and
487+
<a href="#fragment-overflow">fragment overflow</a>.
488+
</dd>
489+
</dl>
490+
491+
<div class="issue">
492+
Having split the overflow and fragmentation properties, this issue is no longer relevant, but there are
493+
useful bits of information in the thread, so I am leaving it here for now.
494+
513495
There are <a href="http://lists.w3.org/Archives/Public/www-style/2012May/1197.html">discussions</a>
514496
about how overflow, overflow-style, overflow-x and overflow-y
515497
should work and interact with each other.
516498
Until consensus on this topic is reached,
517499
it is not completely clear which of these
518500
should be used for
519501
paged-x | paged-y | paged-x-controls | paged-y-controls | fragments
520-
</p>
521-
522-
<h2 id="scrolling-overflow">Scrolling and hidden overflow</h2>
523-
524-
<p class="issue">
525-
Move material from [[CSS21]] and [[CSS3BOX]] here.
526-
</p>
502+
</div>
527503

528-
<p class="issue">
529-
Explain which directions allow scrolling and which don't,
530-
as a function of 'direction'
531-
(including propagation of 'direction' to the ICB).
532-
</p>
533504

534505
<h2 id="paginated-overflow">Paginated overflow</h2>
535506

0 commit comments

Comments
 (0)