Best approach to css drop shadow technique - non image

Question

Looking for the best approach for a non-image CSS Drop Shadow technique.

I have a popup that I would like to add a shadow to.

Bonus question:

Can it work with:

• -moz-border-radius
• -webkit-border-radius

Answer 1

You can use box-shadow and -webkit-box-shadow, see:

http://net.tutsplus.com/tutorials/html-css-techniques/html-5-and-css-3-the-techniques-youll-soon-be-using/

for more info.

Answer 2

I can't tell whether it's the best approach, but you might want to check out the ASP.NET AjaxControlToolkit DropShadow extender. It creates a few styled div to simulate the shadow.