Skip to content

Commit 56a5094

Browse files
committed
add details to step 2-A
1 parent f40eb4b commit 56a5094

2 files changed

Lines changed: 680 additions & 782 deletions

File tree

css3-exclusions/Exclusions.src.html

Lines changed: 52 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -812,10 +812,10 @@ <h4 id="exclusions-processing-model-description">Description</h4>
812812

813813
<ul>
814814
<li><strong>Step 1</strong>: resolve exclusion boxes belonging to each <span>wrapping context</span></li>
815-
<li><strong>Step 2</strong>: resolve <span>wrapping context</span>s and layout each containing block in turn:
815+
<li><strong>Step 2</strong>: resolve <span>wrapping context</span>s and lay out each containing block in turn:
816816
<ul>
817817
<li><strong>Step 2-A</strong>: resolve the position and size of exclusion boxes</li>
818-
<li><strong>Step 2-B</strong>: layout containing block, wrapping around exclusion areas</li>
818+
<li><strong>Step 2-B</strong>: lay out containing block, wrapping around exclusion areas</li>
819819
</ul>
820820
</li>
821821
</ul>
@@ -827,36 +827,62 @@ <h4 id="step-1-resolve-exclusion-boxes-belonging-to-each-wrapping-context">Step
827827
definition of containing blocks and elements with a computed value for 'wrap-flow'
828828
that is not <code class="css">auto</code>.</p>
829829

830-
<h4 id="step-2-resolve-wrapping-contexts-layout-containing-blocks">Step 2: resolve wrapping contexts and layout containing blocks</h4>
830+
<h4 id="step-2-resolve-wrapping-contexts-layout-containing-blocks">Step 2: resolve wrapping contexts and lay out containing blocks</h4>
831831

832832
<p>In this step, starting from the
833833
top of the <a href="http://www.w3.org/TR/CSS2/visuren.html#z-index">rendering tree</a> (see [[!CSS21]]),
834834
the the agent processes each containing block in two sub-steps.</p>
835835

836836
<h4 id="step-2-A-resolve-exclusions-position-and-size">Step 2-A: resolve the position and size of exclusion boxes</h4>
837837

838-
<p>Resolving the position and size of <span>exclusion boxes</span> in the
839-
<span>wrapping context</span> may or may not require
840-
a layout. For example, if an <span>exclusion box</span> is absolutely positioned and sized,
841-
a layout may not be needed to resolve its position and size. In other situations, laying out the
842-
containing block's content is required.</p>
838+
<p>Resolving the position and size
839+
of <span>exclusion boxes</span>
840+
in the <span>wrapping context</span>
841+
may or may not require a layout.
842+
For example,
843+
if an <span>exclusion box</span>
844+
is absolutely positioned and sized,
845+
a layout may not be needed
846+
to resolve its position and size.
847+
In other situations,
848+
laying out the containing block's content is required.</p>
843849

844-
<p>When a layout is required,
845-
it is carried out without applying any <span>exclusion area</span>. In other words, the containing
846-
block is laid out without a <span>wrapping context</span>. </p>
850+
<p>When a layout is required,
851+
it is carried out
852+
without applying any <span>exclusion area</span>.
853+
In other words,
854+
the containing block is laid out
855+
without a <span>wrapping context</span>. </p>
847856

848857
<p>Step 2-A yields a position and size
849-
for all <span>exclusion boxes</span> in the <span>wrapping context</span>.</p>
850-
851-
<p>Scrolling is ignored in this step when resolving the position and size of
852-
'position:fixed' <span>exclusion boxes</span>.</p>
858+
for all <span>exclusion boxes</span>
859+
in the <span>wrapping context</span>.
860+
Each exclusion box is processed in turn,
861+
starting from the top-most,
862+
and each <span>exclusion area</span>
863+
is computed and contributed
864+
to the <a href="http://www.w3.org/TR/CSS2/visudet.html#containing-block-details">containing block's</a>
865+
<span>wrapping context</span>. </p>
853866

867+
<p>Scrolling is ignored in this step
868+
when resolving the position and size
869+
of 'position:fixed' <span>exclusion boxes</span>.</p>
870+
871+
<p>Once the <a href="http://www.w3.org/TR/CSS2/visudet.html#containing-block-details">containing block's</a>
872+
<span>wrapping context</span> is computed,
873+
all <span>exclusion boxes</span>
874+
in that <span>wrapping context</span>
875+
are removed from the normal flow.</p>
854876

855-
<h4 id="step-2-B-layout-containing-block-applying-wrapping">Step 2-B: layout containing block applying wrapping</h4>
877+
<h4 id="step-2-B-layout-containing-block-applying-wrapping">Step 2-B: lay out containing block applying wrapping</h4>
856878

857-
<p>Finally, the content of the containing block is laid out, with the
858-
inline content wrapping around the <span>wrapping content</span>'s
859-
<span>exclusion areas</span> (which may be different from the <span>exclusion box</span>
879+
<p>Finally, the content
880+
of the containing block is laid out,
881+
with the inline content wrapping around
882+
the <span>wrapping content</span>'s
883+
<span>exclusion areas</span>
884+
(which may be different
885+
from the <span>exclusion box</span>
860886
because of the 'shape-outside' property).</p>
861887

862888
<p>When the containing block itself is an <span>exclusion box</span>, then
@@ -968,30 +994,30 @@ <h5>Step 1: resolve exclusion boxes belonging to each <span>wrapping context</sp
968994
<span>wrapping context</span>: WC-1</li>
969995
</ul>
970996

971-
<h5>Step 2: resolve wrapping contexts and layout containing blocks</h5>
997+
<h5>Step 2: resolve wrapping contexts and lay out containing blocks</h5>
972998

973999
<p>In this step, each containing block is processed in turn. For each containing block,
9741000
we (conceptually) go through two phases:</p>
9751001
<ol>
9761002
<li>resolve the <span>wrapping context</span>: resolve the position and size of its exclusions</li>
977-
<li>layout the containing block</li>
1003+
<li>lay out the containing block</li>
9781004
</ol>
9791005

9801006
<p>In our example, this breaks down to:</p>
9811007
<ol>
9821008
<li>resolve the position and size of the exclusions belonging to WC-1: RWC-1 (Resolved Wrapping Context 1).</li>
983-
<li>layout the initial containing block (i.e., layout its content):
1009+
<li>lay out the initial containing block (i.e., lay out its content):
9841010
<ol>
9851011
<li>resolve the html element's <span>wrapping context</span>: RWC-1</li>
986-
<li>layout the html element:
1012+
<li>lay out the html element:
9871013
<ol>
9881014
<li>resolve the body element's <span>wrapping context</span>: RWC-1</li>
989-
<li>layout the body element:
1015+
<li>lay out the body element:
9901016
<ol>
9911017
<li>resolve the <code class="idl">d1</code> element's <span>wrapping context</span>: RWC-2</li>
992-
<li>layout the <code class="idl">d1</code> element</li>
1018+
<li>lay out the <code class="idl">d1</code> element</li>
9931019
<li>resolve the <code class="idl">d2</code> element's <span>wrapping context</span>: RWC-1</li>
994-
<li>layout the <code class="idl">d2</code> element</li>
1020+
<li>lay out the <code class="idl">d2</code> element</li>
9951021
</ol>
9961022
</li>
9971023
</ol>

0 commit comments

Comments
 (0)