I'm hoping someone can help me with some alterations to the CSS code for the main layout stylesheet, as well as some corresponding html for my default template page.
What I'd like to do is add an image to both sides that shows a shadow change of color from the main page wrapper to the background color and have it repeat-y down both sides using this image:
I also want the four courners to be rounded and shadowed using this image (or a rotation of it):
So far, I have been able to get the side image to repeat nicely for the header and the top corners, but whenever i try to make add images to the sides of the page, it messes everything up. I've tried adding new boxes with vertically repeating backgrounds using my images to the left and right right after the "Pagewrapper" element and just before the "Container" element on my layout html page. Yet this is getting me no-where fast. Honestly I don't know where to start and I'm wondering if someone could give me some tips to get it accomplished so that it works on all my pages. Right now I was able to fake it by using an html table for my main template page, but of course it vanishes when i navigate through the side and the site pulls up different templates.
But this is the design I'm shooting for:
http://energia.kevinruess.info/
And this is what it's like without the fake table added in (my sad reality):
http://www.kevinruess.info/energia/index.php?page=home
I'm new to css and it's definetly overwhelming to me so far, but i'm trying my best.
Any help would be greatly appreciated.
kevin
