CSS Shadow Filter Puzzle!

Hey ya'll!! I need some help. I haven't done HTML since the old days, and I am loving up this CSS. I'm new to it, and everyone will probably suggest a variety of ways to script my page...

But my real problem is the shadow filter. I want to apply it such that I get a shadow on the left AND the right side of my <DIV>. I can successfully apply it to one side or the other, but when I try to do both it just wont work. I'm guessing it has to do with margins and padding, but I'm really not sure.

ALSO - you will notice that I attempt to center my main <DIV>, but it doesnt work once I apply the shadow class. Otherwise it works. I want the site content to be centered and a shadow on the left and right borders.

I have two examples of my rShadow and lShadow classes so you can see what I am talking about:

http://www.atecdiversified.com/livetest/left.html
http://www.atecdiversified.com/livetest/right.html


Here is my shadow code:

<STYLE>
   DIV.rShadow {width:1px;padding-right:10px;filter:shadow(color:gray, direction:90);}
   DIV.lShadow {width:1px;padding-left:10px;filter:shadow(color:gray, direction:270);}
</STYLE>

Code (markup):

I am looking to publish this site on by Monday. Thanks!!

 

DIV.Shadow {width:1px;padding:10px;filter:shadow(color:gray, direction:90) shadow(color:gray, direction:270);}

You dummy. Okay - now how do I center it?

 

Sorry, but what exactly are you trying to center?

 

I'm trying to center my DIV. You can see from the links above that even though I have coded the DIV to be centered, adding the Shadow class throws everything to the left of the page. If you take the shadow out, it is centered like it is suppose to be.

I've tried centering it with CSS as well with auto margins... no luck

 

I am also trying to stretch the DIV to 100% of the page - I dont want empty space between the top logo and the page. Same for the bottom. This way the shadowed edges run the full length of the page.