Mon, 01 Oct 2012 13:27:44 -0700
[css-exclusions] Specify overflow behavior for shape-inside
1.1 --- a/css3-exclusions/Exclusions.src.html Mon Oct 01 12:17:55 2012 +0800 1.2 +++ b/css3-exclusions/Exclusions.src.html Mon Oct 01 13:27:44 2012 -0700 1.3 @@ -1487,13 +1487,6 @@ 1.4 <p class="short-desc">Should we revisit the decision to not allow SVG path syntax in the shape-inside, shape-outside properties</p> 1.5 </div> 1.6 </div> 1.7 - 1.8 - <div class="issue-marker" data-bug_id="16460" data-bug_status="NEW"> 1.9 - <a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=16460">Issue-16460</a> 1.10 - <div class="issue-details"> 1.11 - <p class="short-desc">Specify overflow behavior for shape-inside</p> 1.12 - </div> 1.13 - </div> 1.14 </div> 1.15 1.16 <p>The values of this property have the following meanings:</p> 1.17 @@ -1537,6 +1530,30 @@ 1.18 <img alt="Content flowing with and without a shape-inside" src="images/shape-inside-content.png"/> 1.19 <p class="caption">Effect of shape-inside on inline content.</p> 1.20 </div> 1.21 + 1.22 + <p>Overflow content can overlap 1.23 + the bottom edge of a shape-inside, 1.24 + and overflow content can be displayed 1.25 + below the content area defined by shape-inside. 1.26 + When content overflows in the block direction, 1.27 + the last line in the content area determines its width(s) 1.28 + by finding the minimum shape width(s) 1.29 + in the remaining area 1.30 + between the line's top edge 1.31 + and the shape's bottom edge. 1.32 + This can result 1.33 + in the line intersecting the shape's bottom edge, 1.34 + or a zero-width line 1.35 + if (for instance) the shape's bottom edge 1.36 + is a continuous curve. 1.37 + Further overflow is laid out 1.38 + as if the shape-inside was set to 'auto'.</p> 1.39 + 1.40 + <div class='figure'> 1.41 + <img alt="Overflow interacting with rounded rect" style="display:inline-block;vertical-align:top" src="images/rounded-rect-overflow.png"/> 1.42 + <img alt="Overflow interacting with ellipse" style="display:inline-block;vertical-align:top" src="images/ellipse-overflow.png"/> 1.43 + <p class="caption">Overflow interacting with the bottom edge of shapes.</p> 1.44 + </div> 1.45 1.46 <!-- End section "The shape-inside property" --> 1.47 <h4 id="shape-image-threshold-property">The 'shape-image-threshold' Property</h4>
2.1 --- a/css3-exclusions/Overview.html Mon Oct 01 12:17:55 2012 +0800 2.2 +++ b/css3-exclusions/Overview.html Mon Oct 01 13:27:44 2012 -0700 2.3 @@ -10,10 +10,10 @@ 2.4 <link href="http://purl.org/dc/terms/" rel=schema.DC> 2.5 <meta content="CSS Exclusions and Shapes Module Level 3" name=DC.title> 2.6 <meta content=text name=DC.type> 2.7 - <meta content=2012-09-13 name=DC.issued> 2.8 + <meta content=2012-10-01 name=DC.issued> 2.9 <meta content="http://dev.w3.org/csswg/css3-exclusions/" name=DC.creator> 2.10 <meta content=W3C name=DC.publisher> 2.11 - <meta content="http://www.w3.org/TR/2012/ED-css3-exclusions-20120913/" 2.12 + <meta content="http://www.w3.org/TR/2012/ED-css3-exclusions-20121001/" 2.13 name=DC.identifier> 2.14 <link href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright" 2.15 rel=DC.rights> 2.16 @@ -50,15 +50,14 @@ 2.17 2.18 <h1 id=css-exclusions-module>CSS Exclusions and Shapes Module Level 3</h1> 2.19 2.20 - <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 13 September 2.21 - 2012</h2> 2.22 + <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 1 October 2012</h2> 2.23 2.24 <dl> 2.25 <dt>This version: 2.26 2.27 <dd><a 2.28 href="http://dev.w3.org/csswg/css3-exclusions/">http://dev.w3.org/csswg/css3-exclusions/</a></dd> 2.29 - <!--<dd><a href="http://www.w3.org/TR/2012/ED-css3-exclusions-20120913/">http://www.w3.org/TR/2012/WD-css3-exclusions-20120913/</a></dd>--> 2.30 + <!--<dd><a href="http://www.w3.org/TR/2012/ED-css3-exclusions-20121001/">http://www.w3.org/TR/2012/WD-css3-exclusions-20121001/</a></dd>--> 2.31 2.32 <dt>Latest version: 2.33 2.34 @@ -1953,14 +1952,6 @@ 2.35 syntax in the shape-inside, shape-outside properties 2.36 </div> 2.37 </div> 2.38 - 2.39 - <div class=issue-marker data-bug_id=16460 data-bug_status=NEW> <a 2.40 - href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=16460">Issue-16460</a> 2.41 - 2.42 - <div class=issue-details> 2.43 - <p class=short-desc>Specify overflow behavior for shape-inside 2.44 - </div> 2.45 - </div> 2.46 </div> 2.47 2.48 <p>The values of this property have the following meanings: 2.49 @@ -2017,6 +2008,24 @@ 2.50 src="images/shape-inside-content.png"> 2.51 <p class=caption>Effect of shape-inside on inline content. 2.52 </div> 2.53 + 2.54 + <p>Overflow content can overlap the bottom edge of a shape-inside, and 2.55 + overflow content can be displayed below the content area defined by 2.56 + shape-inside. When content overflows in the block direction, the last line 2.57 + in the content area determines its width(s) by finding the minimum shape 2.58 + width(s) in the remaining area between the line's top edge and the shape's 2.59 + bottom edge. This can result in the line intersecting the shape's bottom 2.60 + edge, or a zero-width line if (for instance) the shape's bottom edge is a 2.61 + continuous curve. Further overflow is laid out as if the shape-inside was 2.62 + set to ‘<code class=property>auto</code>’. 2.63 + 2.64 + <div class=figure> <img alt="Overflow interacting with rounded rect" 2.65 + src="images/rounded-rect-overflow.png" 2.66 + style="display:inline-block;vertical-align:top"> <img 2.67 + alt="Overflow interacting with ellipse" src="images/ellipse-overflow.png" 2.68 + style="display:inline-block;vertical-align:top"> 2.69 + <p class=caption>Overflow interacting with the bottom edge of shapes. 2.70 + </div> 2.71 <!-- End section "The shape-inside property" --> 2.72 2.73 <h4 id=shape-image-threshold-property><span class=secno>4.4.3. </span>The
3.1 --- a/css3-exclusions/images/ellipse-overflow.graffle Mon Oct 01 12:17:55 2012 +0800 3.2 +++ b/css3-exclusions/images/ellipse-overflow.graffle Mon Oct 01 13:27:44 2012 -0700 3.3 @@ -680,7 +680,7 @@ 3.4 </dict> 3.5 <dict> 3.6 <key>Bounds</key> 3.7 - <string>{{224, 256}, {124.00000762939453, 28.75}}</string> 3.8 + <string>{{144.00004291534424, 256}, {287.99996948242188, 28.75}}</string> 3.9 <key>Class</key> 3.10 <string>ShapedGraphic</string> 3.11 <key>FontInfo</key> 3.12 @@ -838,7 +838,7 @@ 3.13 <key>MasterSheets</key> 3.14 <array/> 3.15 <key>ModificationDate</key> 3.16 - <string>2012-09-28 00:12:28 +0000</string> 3.17 + <string>2012-10-01 20:14:45 +0000</string> 3.18 <key>Modifier</key> 3.19 <string>Alan Stearns</string> 3.20 <key>NotesVisible</key>
4.1 Binary file css3-exclusions/images/ellipse-overflow.png has changed