Skip to content

Commit 0641789

Browse files
committed
[css-backgrounds-3] Slight clarifying wording tweaks to shadow radius rules.
1 parent ed8248f commit 0641789

1 file changed

Lines changed: 4 additions & 3 deletions

File tree

css-backgrounds-3/Overview.bs

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2917,19 +2917,20 @@ Shadow Shape, Spread, and Knockout</h4>
29172917

29182918
<p>To preserve the box's shape when spread is applied,
29192919
the corner radii of the shadow are also increased (decreased, for inner shadows)
2920-
from the border-box radii by adding (subtracting)
2920+
from the border-box (padding-box) radii by adding (subtracting)
29212921
the <i>spread distance</i> (and flooring at zero).
29222922
However, in order to create a sharper corner when the border radius is small
29232923
(and thus ensure continuity between round and sharp corners),
29242924
when the <i>border radius</i> is less than the <i>spread distance</i>
29252925
(or in the case of an inner shadow,
29262926
less than the absolute value of a negative <i>spread distance</i>),
29272927
the <i>spread distance</i>
2928-
is multiplied by the proportion 1 + (<var>r</var>-1)<sup>3</sup>,
2928+
is first multiplied by the proportion 1 + (<var>r</var>-1)<sup>3</sup>,
29292929
where <var>r</var> is the ratio of the border radius to the <i>spread distance</i>,
29302930
in calculating the corner radii of the spread shadow shape.
29312931
For example, if the border radius is 10px and the <i>spread distance</i> is 20px (<var>r</var> = .5),
2932-
the corner radius of the shadow shape will be 10px + 20px × (1 + (.5 - 1)<sup>3</sup>) = 27.5px.
2932+
the corner radius of the shadow shape will be 10px + 20px × (1 + (.5 - 1)<sup>3</sup>) = 27.5px
2933+
rather than 30px.
29332934
This adjustment is applied independently to the radii in each dimension.
29342935

29352936
<p>The 'border-image' does not affect the shape of the box-shadow.

0 commit comments

Comments
 (0)