Feather background edges in a div

I am running a wordpress theme and am attempting to feather the background color of each widget.

For example, here is the site: http://www.firesteveaddazio.com

You can see each of the widgets have a light blue background-color css property. However, it ends abrubtly showing a hard rectangle shape. I would like the edges of that to be feathered such that the widget blends back into the normal white background.

 

use this code

-moz-border-radius:10px 10px 10px 10px;
-moz-box-shadow:0 0 10px;
padding:10px 0 20px 10px;

Code (markup):

also remove the border property

border-bottom:5px solid #FAFAFA;

Code (markup):

here the output

 

Thanks bhuthecoder! That worked great in firefox, however it had no effect in IE. What do I need to do to get it working in IE?

 

IE is not a modern browser and it can't be done using CSS.

 

border-radius is not feather.

Google for IECSS3 fix for those border-radius effects.

Good luck