On 1/14/12 1:16 PM, Tim Climis wrote:
On Saturday, January 14, 2012 4:06:30 pm Stephen Britton wrote:
I am experimenting with CSS3 drop shadows. Most examples only show
it working with two sides - usually the bottom and right or left
side. Is there a way to have the shadow cover all sides - top,
bottom, right and left?
Here is some sample code that I have been working with. It only
covers the bottom and right side.
-moz-box-shadow: 8px 8px 8px #ddd; -webkit-box-shadow: 8px 8px 8px
#ddd; box-shadow: 8px 8px 8px #ddd;
You just have to make the spread of the shadow bigger than then
offset.
box-shadow: 0 0 4px #ddd;
Or, with what you have:
box-shadow: 8px 8px 10px #ddd;
That'll give a 2px top and left shadow, and a 10px bottom and right
shadow.
---Tim
To add to Tim's suggestion, be aware that you can specify a fourth
length value - "spread." That lets you increase (+) or decrease(-) the
size of the shadow that's "behind" the box.
You can also create more than one shadow, of course (and use negative
"X" or "Y" values to put the shadow to the left or above the box.)
--
Cordially,
David
______________________________________________________________________
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/
