asked on

Creating CSS shadow effect in HTML5

I have a question regarding a site that I am creating. The concept is here: www.interstellar9.com/sharonfarber.html

I want the content to be centered in the browser, and I want to create a cast shadow from the section that holds the image with the quote (this will be a slide show).

My question is, is there, and if there is, how do I create this CSS or HTML shadowing, or does it have to be done in the background image that surrounds the section div?

Thanks!

SOLUTION

Abhijeet Rananaware

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Revolution9

ASKER

Thanks Abhijit - will this work on all browsers?

Abhijeet Rananaware

It works on all browsers except IE7

IE7 doesnt support blur property in box-shadow.

You need to put fallback for IE7.

Revolution9

ASKER

This is obviously wrong. Can you help me?

.container {
      width: 960px;
      background: #FFF;
      margin: 0 auto;
      .box_shadow{
-moz-box-shadow: 0px 0px 40px #000000;
-webkit-box-shadow: 0px 0px 40px #000000;
box-shadow: 0px 0px 40px #000000;
}

ASKER CERTIFIED SOLUTION

Dave Baldwin

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Abhijeet Rananaware

Yes your format is incorrect. Use Dave's code.

Revolution9

ASKER

Thanks guys!