Is there a way to do this, with css 3?

Question

So how can I do this, using css3, mabe box-shadow? http://screencast.com/t/48LooBwz

Can someone help me?

I need to apply that styling to an element?

Best Regards,

Answer 1

What do you mean, a 1px drop shadow? Yep, 'box-shadow' would do (except for IE of course).

/* horizontal offset, vertical offset, blur radius, color */
box-shadow: 0 1px 1px rgba(0,0,0,.1);
-moz-box-shadow: 0 1px 1px rgba(0,0,0,.1);
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.1);

Answer 2

Do you mean this : box-shadow: 0px 10px 5px #888; ?

info : http://www.css3.info/preview/box-shadow/

Doesn't work in all browser.

Answer 3

You could use box-shadow, and hack it for IE:

.shadow {
        zoom:1; /* This enables hasLayout, which is required for older IE browsers */
        filter: progid:DXImageTransform.Microsoft.Shadow(color='#b0b0b0', Direction=135, Strength=3);
        -moz-box-shadow:2px 2px 2px #b0b0b0;
        -webkit-box-shadow:2px 2px 2px #b0b0b0;
        box-shadow:2px 2px 2px #b0b0b0;
}

Here's an example: http://www.splashdust.net/2010/05/ie-hack-css-dropshadow/