On 16/01/2012 4:15 PM, Ghodmode wrote:
On Sun, Jan 15, 2012 at 8:58 AM, Alan Gresley<a...@css-class.com> wrote:
Not so. There needs to be a forth value in the box-shadow string to indicate
spread. Something like this spreads the shadow evenly on all sides.
box-shadow:0px 0px 0.5em 0.5em gray;
The spec goes into some detail in explaining the variations of box-shadow
(see example 29 and 30).
http://dev.w3.org/csswg/css3-background/#the-box-shadow
Unfortunately the webkit variation doesn't support the 4th number:
http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/doc/uid/TP30001266--webkit-box-shadow
The blur radius will make the shadow appear on all four sides, though.
.box {
-moz-box-shadow: 0 0 10px black;
-webkit-box-shadow: 0 0 10px black;
box-shadow: 0 0 10px black;
}
To my memory, all versions of Safari 5 has supported the forth value of
spread. I have found the patch for it here [1] which was landed in late
2010 (over a year ago). A test case.
<!DOCTYPE html>
<style type="text/css">
p, div { width: 10em; margin: 3em; font-size: 200%; box-shadow: 0 0 0
1em black; }
div { box-shadow: 0 0 1em 1em black; }
</style>
<p>Some text shadow</p>
<div>Some text shadow</div>
1. https://bugs.webkit.org/show_bug.cgi?id=51448
--
Alan Gresley
http://css-3d.org/
http://css-class.com/
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/