Drop shadow around mainwrapper

[rayring]

Dear Zenners

I like to have a shadow border around the mainwrapper, all around it. (top, left, right and bottom)

I spend hours editing the tpl_main_page.php and the stylesheet but I'm not able to do this. Can you help me with this, please.

This is what I've come up with so far:

Edited the tpl_main_page.php in the template default/common dit.
Added these divs <div id="mainWrapperLeft">
<div id="mainWrapperRight"> and the 2 closing </div> 's

In the stylesheet I added:

#mainWrapperLeft {background:url(../images/shadowLeft.png)repeat-y 0 0;background-position: top left;}

#mainWrapperRight {background:url(../images/shadowRight.png) repeat-y 100% 0;}

The shadow appears on the site but not on the right position.
Padding does not help... I try to make this happen and stil have not a clue how to do this for the top and bottom, and how the shadow stays at the bottom when the page gets longer....

Can anyone help me in the right direction
You can view my site here: http://bit.ly/fCK3s9

Thank you in advance... Rayring

[kobra]

Edited the tpl_main_page.php in the template default/common dir.

First off, NEVER edit a core file that can be overridden
Place it in the appropriate folder in your template and create the folder is it does not exist
https://www.zen-cart.com/tutorials/i...hp?article=346
https://www.zen-cart.com/tutorials/index.php?article=36

Then look at your view source

Those new divs do not exist

[rayring]

First off, NEVER edit a core file that can be overridden
Place it in the appropriate folder in your template and create the folder is it does not exist
https://www.zen-cart.com/tutorials/i...hp?article=346
https://www.zen-cart.com/tutorials/index.php?article=36

Then look at your view source

Those new divs do not exist

Hi Kobra, thank you for your response, I put the tpl_main_page.php in my custom template now. I took out the divs because I thought they were no good. I added them again.
In firefox I can see the left and right shadow images in IE only the right one. I just cant get them to hugg the mainwrapper...

What am I doing wrong I know I am a CSS newbie....