Programmatically produce a paper shadow

On this page, you'll notice a shadow on the left border. It's done with an image. Is it possible to produce sha开发者_如何学Godows like this entirely programmatically with CSS or anything else.

You're looking for the box-shadow property in CSS3.

The canonical syntax is:

#example1 {
box-shadow: 10px 10px 5px #888;
}

You can support in Mozilla and WebKit with the following syntax:

#example1 {
-moz-box-shadow: 10px 10px 5px #888;
-webkit-box-shadow: 10px 10px 5px #888;
box-shadow: 10px 10px 5px #888;
}

(These examples are from http://www.css3.info/preview/box-shadow/ )

You can get compatibility for this in Internet Explorer with CSS3 Pie

the box-shadow property available in css3 can help you solve this problem

for browser compatibility you can set it this way,

#div {
-moz-box-shadow: 2px 3px 3px #888;
-webkit-box-shadow: 10px 10px 5px #888;
box-shadow: 10px 10px 5px #888;
} 

the properties are

left right blur and color