[css-backgrounds] Define curve of margin edge using spread curve formula.

Author: fantasai

css-backgrounds/Overview.html

@@ -2907,6 +2907,13 @@ <h3 id=corner-shaping><span class=secno>5.2. </span>Corner Shaping</h3>
     sides' borders, the arc of the padding edge is less than 90°.
   </div>
 
+  <p>The margin edge, being outside the border edge, calculates its radius by
+   adding the corresponding margin thickness to each border radius. However,
+   in order to create a sharper corner when the border radius is small, if
+   the ratio <var>r</var> of the border radius to the margin is less than one
+   the margin thickness is multiplied by the proportion 1 +
+   (<var>r</var>-1)<sup>3</sup> in this calculation.
+
   <h3 id=corner-clipping><span class=secno>5.3. </span>Corner Clipping</h3>
 
   <p>A box's backgrounds, but not its <a
@@ -4552,6 +4559,11 @@ <h3 id=changes-2012-07><span class=secno>9.1. </span> Changes since the 24
     class=property>border-image-width</code></a>’ is initially set to the
     computed ‘<a href="#border-width"><code
     class=property>border-width</code></a>’, which in this case is zero).
+
+   <li>Add definition for how the margin edge is curved in response to
+    border-radius. (This is relevant for <a href="#ref-CSS-SHAPES"
+    rel=biblioentry>[CSS-SHAPES]<!--{{CSS-SHAPES}}--></a>, but does not
+    change conformance to CSS Backgrounds and Borders Level 3.)
   </ul>
 
   <h3 id=changes-2012-04><span class=secno>9.2. </span> Changes since the 17
@@ -4866,6 +4878,16 @@ <h3 class=no-num id=other-references> Other References</h3>
    </dd>
    <!---->
 
+   <dt id=ref-CSS-SHAPES>[CSS-SHAPES]
+
+   <dd>Vincent Hardy; Rossen Atanassov; Alan Stearns. <a
+    href="http://www.w3.org/TR/2013/WD-css-shapes-1-20130620/"><cite>CSS
+    Shapes Module Level 1.</cite></a> 20 June 2013. W3C Working Draft. URL:
+    <a
+    href="http://www.w3.org/TR/2013/WD-css-shapes-1-20130620/">http://www.w3.org/TR/2013/WD-css-shapes-1-20130620/</a>
+   </dd>
+   <!---->
+
    <dt id=ref-CSS1>[CSS1]
 
    <dd>Håkon Wium Lie; Bert Bos. <a

css-backgrounds/Overview.src.html

@@ -2056,6 +2056,13 @@ <h3 id="corner-shaping">Corner Shaping</h3>
   sides' borders, the arc of the padding edge is less than 90&deg;.
 </div>
 
+<p>The margin edge, being outside the border edge, calculates its radius
+by adding the corresponding margin thickness to each border radius.
+However, in order to create a sharper corner when the border radius is small,
+if the ratio <var>r</var> of the border radius to the margin is less than one
+the margin thickness is multiplied by the proportion 1 + (<var>r</var>-1)<sup>3</sup>
+in this calculation.
+
 <h3 id="corner-clipping">Corner Clipping</h3>
 
 <p>A box's backgrounds, but not its <a href="#the-border-image">border-image</a>,
@@ -3314,6 +3321,8 @@ <h3 id="changes-2012-07">
   <li>Tighten up the definition of spread for 'box-shadow'.
   <li>Clarify that a 'border-style' of ''none'' also implies an initial 'border-image-width' of zero
     (since 'border-image-width' is initially set to the computed 'border-width', which in this case is zero).
+  <li>Add definition for how the margin edge is curved in response to border-radius.
+    (This is relevant for [[CSS-SHAPES]], but does not change conformance to CSS Backgrounds and Borders Level 3.)
 </ul>
 
 <h3 id="changes-2012-04">