views:

214

answers:

1

I have trouble setting multiple shadows on one element in webkit:

-moz-box-shadow: inset 0 0 3px #999, 0 0 5px #fff;
-webkit-box-shadow: inset 0 0 3px #999, 0 0 5px #fff;
box-shadow: inset 0 0 3px #999, 0 0 5px #fff;

it works fine in firefox but safari displays only the inset shadow. i tried to set both values separately. But safari takes just count of the last value:

-webkit-box-shadow: inset 0 0 3px #999;
-webkit-box-shadow: 0 5px #fff;

is it possible to set more then one shadow on a single element in safari/webkit?

+2  A: 

This sounds stupid, but I think the best documentation for WebKit-specific CSS 3 features is on... MDC, in your case the relevant page is -moz-box-shadow. It contains an example of a box with multiple shadows, a link to a page containing more examples, as well as a compatibility table.

As you can see, multiple shadows are only supported from Safari 4.0 (onwards).

Marcel Korpel