Skip to content

Commit 29f64c4

Browse files
committed
Editorial changes
1 parent 415d34d commit 29f64c4

2 files changed

Lines changed: 86 additions & 73 deletions

File tree

css3-exclusions/Exclusions.src.html

Lines changed: 33 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -152,20 +152,21 @@ <h2 class="no-num no-toc">[LONGSTATUS] [DATE]</h2>
152152

153153
<h2 class="no-num no-toc" id="abstract">Abstract</h2>
154154

155+
155156
<p>
156-
CSS exclusions define arbitrary areas around which inline content can flow.
157-
CSS exclusions can be defined on any CSS block-level elements.
158-
</p>
159-
<p>
160-
CSS Shapes control the geometric shapes used for wrapping inline
161-
flow content outside or inside an element.
162-
163-
</p>
164-
<p>
165-
Combining CSS Exclusions and CSS Shapes allows sophisticated layouts,
166-
for example having content flow into and/or around
167-
circles or other, arbitrarily complex shapes.
168-
</p>
157+
CSS Exclusions define arbitrary areas around which inline content can flow.
158+
CSS Exclusions can be defined on any CSS block-level elements. CSS
159+
Exclusions extend the notion of content wrapping previously limited to
160+
floats.</p>
161+
162+
<p>CSS Shapes control the geometric shapes used for wrapping inline flow
163+
content outside or inside an element. CSS Shapes can be applied to any
164+
element. A circle shape on a float will cause inline content to wrap around
165+
the circle shape instead of the float's bounding box.</p>
166+
167+
<p>Combining CSS Exclusions and CSS Shapes allows sophisticated layouts,
168+
allowing interactions between shapes in complex positioning schemes.</p>
169+
169170
<h2 class="no-num no-toc" id="status">Status of this document</h2>
170171
<!--status-->
171172
<p>This is the First Public Working Draft of the CSS Exclusions and Shapes Level 3 Module.</p>
@@ -190,7 +191,7 @@ <h2 id="definitions">Definitions</h2>
190191
<dfn>Exclusion box</dfn>
191192

192193
<p>
193-
An box that defines an <span>exclusion area</span> for other boxes. The 'wrap-flow'
194+
A <a href="http://www.w3.org/TR/css3-box/">box</a> ([[!CSS3BOX]]) that defines an <span>exclusion area</span> for other boxes. The 'wrap-flow'
194195
property is used to make an element's generated box an exclusion box. An exclusion box contributes
195196
its <span>exclusion area</span> to its <a href="http://www.w3.org/TR/CSS2/visudet.html#containing-block-details">
196197
containing block's</a> <span>wrapping context</span>
@@ -206,9 +207,9 @@ <h2 id="definitions">Definitions</h2>
206207
<p>
207208
The area used for excluding inline flow content around an exclusion element. The
208209
exclusion area is equivalent to the <a href="http://www.w3.org/TR/CSS2/box.html#box-dimensions">
209-
border box</a> for elements with 'float' property computed to 'none' and the
210-
<a href="http://www.w3.org/TR/CSS2/box.html#box-dimensions">margin box</a> for elements
211-
with 'float' property computed to a value other than 'none'. This specification's
210+
border box</a> for elements whose computed 'float' property is 'none' and the
211+
<a href="http://www.w3.org/TR/CSS2/box.html#box-dimensions">margin box</a> otherwise.
212+
This specification's
212213
'shape-outside' property can be used to define arbitrary, non-rectangular exclusion
213214
areas.
214215
</p>
@@ -222,7 +223,7 @@ <h2 id="definitions">Definitions</h2>
222223
</div>
223224

224225
<p>
225-
The wrapping context of an box is a collection of 'exclusion areas'. The wrapping
226+
The wrapping context of a box is a collection of 'exclusion areas'. The wrapping
226227
context is used to wrap around inline flow content during layout. A box will
227228
wrap its inline flow content in the area that corresponds to the subtraction of
228229
its wrapping context from its own <span>content area</span>.
@@ -311,33 +312,33 @@ <h4 id="wrap-flow-property">The 'wrap-flow' property</h4>
311312
<dl>
312313
<dt><dfn title="'wrap-flow'!!'auto'">auto</dfn></dt>
313314
<dd>
314-
Exclusion is not created and inline flow content interacts with the element as usual.
315-
For example it will wrap around floats and other elements.
315+
No exclusion is created. Inline flow content interacts with the element as usual.
316316
</dd>
317317
<dt><dfn title="'wrap-flow'!!'both'">both</dfn></dt>
318318
<dd>
319319
Inline flow content can flow on all sides of the exclusion.
320320
</dd>
321321
<dt><dfn title="'wrap-flow'!!'start'">start</dfn></dt>
322322
<dd>
323-
Inline flow content can wrap on the start edge of the exclusion area but must leave
324-
the area to end edge of the exclusion area empty.
323+
Inline flow content can flow before the start edge of the exclusion area but
324+
must leave the area after the end edge of the exclusion empty.
325325
</dd>
326326
<dt><dfn title="'wrap-flow'!!'end'">end</dfn></dt>
327327
<dd>
328-
Inline flow content can wrap on the end side of the exclusion area but must leave
329-
the area to the start edge of the exclusion area empty.
328+
Inline flow content can flow after the end edge of the exclusion area but
329+
must leave the area before the start edge of the exclusion empty.
330330
</dd>
331331
<dt><dfn title="'wrap-flow'!!'maximum'">maximum</dfn></dt>
332332
<dd>
333-
Inline flow content can wrap on the side of the exclusion with the largest
334-
available space for the given line, and must leave the other side of the exclusion
333+
Inline flow content can flow on the edge of the exclusion with the largest
334+
available space for the given line, and must leave the other edge of the exclusion
335335
empty.
336336
</dd>
337337
<dt><dfn title="'wrap-flow'!!'clear'">clear</dfn></dt>
338338
<dd>
339-
Inline flow content can only wrap on top and bottom of the exclusion and must leave
340-
the areas to the start and end edges of the exclusion box empty.
339+
Inline flow content can only flow on top and bottom edges of the exclusion
340+
and must leave the areas before the start and after the end edges of the
341+
exclusion empty.
341342
</dd>
342343
</dl>
343344

@@ -352,8 +353,8 @@ <h4 id="wrap-flow-property">The 'wrap-flow' property</h4>
352353
</p>
353354
<p>
354355
When the property's computed value is 'auto', the element does not become an
355-
<span>exclusion element</span> unless its 'float'
356-
property computed value is not 'none'. In that case, the element contributes its
356+
<span>exclusion</span> unless its 'float'
357+
property's computed value is not 'none'. In that case, the element contributes its
357358
'border box' to its containing block's <span>wrapping context</span> and content
358359
flows around it according to the 'clear' property.
359360
</p>
@@ -936,7 +937,7 @@ <h2 id="shapes">Shapes</h2>
936937
Note, while the boundaries used for wrapping inline flow content outside and inside
937938
an element can be defined using shapes, the actual box model does not change. If
938939
the element has specified margins, borders or paddings they will be computed and
939-
rendered according to the [[CSS3-Box]] module.
940+
rendered according to the [[!CSS3BOX]] module.
940941
</p>
941942

942943
<div class="example">
@@ -1007,7 +1008,7 @@ <h4 id="supported-svg-shapes">Supported SVG Shapes</h4>
10071008
or evenodd. Default value when omitted is nonzero.</li>
10081009
<li>
10091010
The two length values represent <strong>xi</strong> and <strong>yi</strong> -
1010-
The <strong>x</strong> and <strong>y</strong> axis coordinate of the i-th vertex of the polygon and
1011+
the <strong>x</strong> and <strong>y</strong> axis coordinates of the i-th vertex of the polygon.
10111012
</li>
10121013
</ul>
10131014
<p>

css3-exclusions/Overview.html

Lines changed: 53 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -120,14 +120,14 @@
120120

121121
<h1 id=css-exclusions-module>CSS Exclusions and Shapes Module Level 3</h1>
122122

123-
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 19 March 2012</h2>
123+
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 27 March 2012</h2>
124124

125125
<dl>
126126
<dt>This version:
127127

128128
<dd><a
129129
href="http://dev.w3.org/csswg/css3-exclusions/">http://dev.w3.org/csswg/css3-exclusions/</a></dd>
130-
<!--<dd><a href="http://www.w3.org/TR/2012/ED-css3-exclusions-20120319/">http://www.w3.org/TR/2012/WD-css3-exclusions-20120319/</a></dd>-->
130+
<!--<dd><a href="http://www.w3.org/TR/2012/ED-css3-exclusions-20120327/">http://www.w3.org/TR/2012/WD-css3-exclusions-20120327/</a></dd>-->
131131

132132
<dt>Latest version:
133133

@@ -188,15 +188,18 @@ <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 19 March 2012</h2>
188188

189189
<h2 class="no-num no-toc" id=abstract>Abstract</h2>
190190

191-
<p> CSS exclusions define arbitrary areas around which inline content can
192-
flow. CSS exclusions can be defined on any CSS block-level elements.
191+
<p> CSS Exclusions define arbitrary areas around which inline content can
192+
flow. CSS Exclusions can be defined on any CSS block-level elements. CSS
193+
Exclusions extend the notion of content wrapping previously limited to
194+
floats.
193195

194-
<p> CSS Shapes control the geometric shapes used for wrapping inline flow
195-
content outside or inside an element.
196+
<p>CSS Shapes control the geometric shapes used for wrapping inline flow
197+
content outside or inside an element. CSS Shapes can be applied to any
198+
element. A circle shape on a float will cause inline content to wrap
199+
around the circle shape instead of the float's bounding box.
196200

197-
<p> Combining CSS Exclusions and CSS Shapes allows sophisticated layouts,
198-
for example having content flow into and/or around circles or other,
199-
arbitrarily complex shapes.
201+
<p>Combining CSS Exclusions and CSS Shapes allows sophisticated layouts,
202+
allowing interactions between shapes in complex positioning schemes.
200203

201204
<h2 class="no-num no-toc" id=status>Status of this document</h2>
202205
<!--begin-status-->
@@ -390,11 +393,13 @@ <h2 id=definitions><span class=secno>2. </span>Definitions</h2>
390393

391394
<p><dfn id=exclusion-box>Exclusion box</dfn>
392395

393-
<p> An box that defines an <a href="#exclusion-area">exclusion area</a> for
394-
other boxes. The &lsquo;<a href="#wrap-flow"><code
395-
class=property>wrap-flow</code></a>&rsquo; property is used to make an
396-
element's generated box an exclusion box. An exclusion box contributes its
397-
<a href="#exclusion-area">exclusion area</a> to its <a
396+
<p> A <a href="http://www.w3.org/TR/css3-box/">box</a> (<a href="#CSS3BOX"
397+
rel=biblioentry>[CSS3BOX]<!--{{!CSS3BOX}}--></a>) that defines an <a
398+
href="#exclusion-area">exclusion area</a> for other boxes. The &lsquo;<a
399+
href="#wrap-flow"><code class=property>wrap-flow</code></a>&rsquo;
400+
property is used to make an element's generated box an exclusion box. An
401+
exclusion box contributes its <a href="#exclusion-area">exclusion area</a>
402+
to its <a
398403
href="http://www.w3.org/TR/CSS2/visudet.html#containing-block-details">
399404
containing block's</a> <a href="#wrapping-context">wrapping context</a>
400405

@@ -411,15 +416,13 @@ <h2 id=definitions><span class=secno>2. </span>Definitions</h2>
411416
<p> The area used for excluding inline flow content around an exclusion
412417
element. The exclusion area is equivalent to the <a
413418
href="http://www.w3.org/TR/CSS2/box.html#box-dimensions"> border box</a>
414-
for elements with &lsquo;<code class=property>float</code>&rsquo; property
415-
computed to &lsquo;<code class=property>none</code>&rsquo; and the <a
419+
for elements whose computed &lsquo;<code
420+
class=property>float</code>&rsquo; property is &lsquo;<code
421+
class=property>none</code>&rsquo; and the <a
416422
href="http://www.w3.org/TR/CSS2/box.html#box-dimensions">margin box</a>
417-
for elements with &lsquo;<code class=property>float</code>&rsquo; property
418-
computed to a value other than &lsquo;<code
419-
class=property>none</code>&rsquo;. This specification's &lsquo;<a
420-
href="#shape-outside"><code class=property>shape-outside</code></a>&rsquo;
421-
property can be used to define arbitrary, non-rectangular exclusion areas.
422-
423+
otherwise. This specification's &lsquo;<a href="#shape-outside"><code
424+
class=property>shape-outside</code></a>&rsquo; property can be used to
425+
define arbitrary, non-rectangular exclusion areas.
423426

424427
<p><dfn id=wrapping-context>Wrapping context</dfn>
425428

@@ -431,7 +434,7 @@ <h2 id=definitions><span class=secno>2. </span>Definitions</h2>
431434
</div>
432435
</div>
433436

434-
<p> The wrapping context of an box is a collection of &lsquo;<a
437+
<p> The wrapping context of a box is a collection of &lsquo;<a
435438
href="#exclusion-area"><code class=css>exclusion areas</code></a>&rsquo;.
436439
The wrapping context is used to wrap around inline flow content during
437440
layout. A box will wrap its inline flow content in the area that
@@ -541,35 +544,34 @@ <h4 id=wrap-flow-property><span class=secno>3.1.1. </span>The &lsquo;<a
541544
<dl>
542545
<dt><dfn id=auto title="'wrap-flow'!!'auto'">auto</dfn>
543546

544-
<dd> Exclusion is not created and inline flow content interacts with the
545-
element as usual. For example it will wrap around floats and other
546-
elements.
547+
<dd> No exclusion is created. Inline flow content interacts with the
548+
element as usual.
547549

548550
<dt><dfn id=both title="'wrap-flow'!!'both'">both</dfn>
549551

550552
<dd> Inline flow content can flow on all sides of the exclusion.
551553

552554
<dt><dfn id=start title="'wrap-flow'!!'start'">start</dfn>
553555

554-
<dd> Inline flow content can wrap on the start edge of the exclusion area
555-
but must leave the area to end edge of the exclusion area empty.
556+
<dd> Inline flow content can flow before the start edge of the exclusion
557+
area but must leave the area after the end edge of the exclusion empty.
556558

557559
<dt><dfn id=end title="'wrap-flow'!!'end'">end</dfn>
558560

559-
<dd> Inline flow content can wrap on the end side of the exclusion area
560-
but must leave the area to the start edge of the exclusion area empty.
561+
<dd> Inline flow content can flow after the end edge of the exclusion area
562+
but must leave the area before the start edge of the exclusion empty.
561563

562564
<dt><dfn id=maximum title="'wrap-flow'!!'maximum'">maximum</dfn>
563565

564-
<dd> Inline flow content can wrap on the side of the exclusion with the
565-
largest available space for the given line, and must leave the other side
566+
<dd> Inline flow content can flow on the edge of the exclusion with the
567+
largest available space for the given line, and must leave the other edge
566568
of the exclusion empty.
567569

568570
<dt><dfn id=clear title="'wrap-flow'!!'clear'">clear</dfn>
569571

570-
<dd> Inline flow content can only wrap on top and bottom of the exclusion
571-
and must leave the areas to the start and end edges of the exclusion box
572-
empty.
572+
<dd> Inline flow content can only flow on top and bottom edges of the
573+
exclusion and must leave the areas before the start and after the end
574+
edges of the exclusion empty.
573575
</dl>
574576

575577
<p> Setting the &lsquo;<a href="#wrap-flow"><code
@@ -588,8 +590,8 @@ <h4 id=wrap-flow-property><span class=secno>3.1.1. </span>The &lsquo;<a
588590

589591
<p> When the property's computed value is &lsquo;<code
590592
class=property>auto</code>&rsquo;, the element does not become an
591-
<span>exclusion element</span> unless its &lsquo;<code
592-
class=property>float</code>&rsquo; property computed value is not
593+
<span>exclusion</span> unless its &lsquo;<code
594+
class=property>float</code>&rsquo; property's computed value is not
593595
&lsquo;<code class=property>none</code>&rsquo;. In that case, the element
594596
contributes its &lsquo;<code class=css>border box</code>&rsquo; to its
595597
containing block's <a href="#wrapping-context">wrapping context</a> and
@@ -1295,8 +1297,8 @@ <h2 id=shapes><span class=secno>4. </span>Shapes</h2>
12951297
<p class=note> Note, while the boundaries used for wrapping inline flow
12961298
content outside and inside an element can be defined using shapes, the
12971299
actual box model does not change. If the element has specified margins,
1298-
borders or paddings they will be computed and rendered according to the
1299-
[[CSS3-Box]] module.
1300+
borders or paddings they will be computed and rendered according to the <a
1301+
href="#CSS3BOX" rel=biblioentry>[CSS3BOX]<!--{{!CSS3BOX}}--></a> module.
13001302

13011303
<div class=example>
13021304
<p>CSS &lsquo;<code class=property>shape</code>&rsquo; and CSS box model
@@ -1377,8 +1379,8 @@ <h4 id=supported-svg-shapes><span class=secno>4.1.1. </span>Supported SVG
13771379
nonzero.
13781380

13791381
<li> The two length values represent <strong>xi</strong> and
1380-
<strong>yi</strong> - The <strong>x</strong> and <strong>y</strong>
1381-
axis coordinate of the i-th vertex of the polygon and
1382+
<strong>yi</strong> - the <strong>x</strong> and <strong>y</strong>
1383+
axis coordinates of the i-th vertex of the polygon.
13821384
</ul>
13831385

13841386
<p> If the polygon is not closed the user-agent will automatically add a
@@ -2035,6 +2037,16 @@ <h3 class=no-num id=normative-references>Normative references</h3>
20352037
</dd>
20362038
<!---->
20372039

2040+
<dt id=CSS3BOX>[CSS3BOX]
2041+
2042+
<dd>Bert Bos. <a
2043+
href="http://www.w3.org/TR/2007/WD-css3-box-20070809"><cite>CSS basic box
2044+
model.</cite></a> 9 August 2007. W3C Working Draft. (Work in progress.)
2045+
URL: <a
2046+
href="http://www.w3.org/TR/2007/WD-css3-box-20070809">http://www.w3.org/TR/2007/WD-css3-box-20070809</a>
2047+
</dd>
2048+
<!---->
2049+
20382050
<dt id=RFC2119>[RFC2119]
20392051

20402052
<dd>S. Bradner. <a href="http://www.ietf.org/rfc/rfc2119.txt"><cite>Key

0 commit comments

Comments
 (0)