Evo
(@shane_tactical1)
Hi Mike,
Im not an expert but i can try and help you.
First create your shadow in something like photoshop making it 10-15 pixels bigger each side of my wrapper.
Then what i normally do is to put a div around the wrapper and name it shadow. So it would be
<div id”shadow”>
<div id=”wrapper”>
Im just putting a shadow on the site im working on at the moment and the wrapper was contained in the header and i closed the divs off in the footer.
So in the footer at the end i had
</div><!– End wrapper–>
</div>>!–End Shadow–>
</body>
</html>
Then go into your style and create the id #shadow. Set the width of this to be able 10-15 pixels each size bigger then your container.
So if your container/wrapper was 700 pixels then it would be either 720 or 730 in width. As your theme is centered you might have to make sure the margins are set to auto left and right depending on how your wrapper is setup.
This is the example of my css for my shadow
#shadow{
width: 1008px;
background-image: url(images/shadow.png);
background-repeat: repeat y;
margin-right: auto;
margin-left: auto;
}
You also might find that the shadow doesnt wrap around the wrapper.
If that happens you add this line before you close the wrapper in the footer.
<div class=”spacer”> </div>
and add this to your css
.spacer {
clear: both !important;
}
As i said im not an expert but that hows i normally do it.
Hi Shane,
Thank you so much for your help, expert or not. I will definetly give this a try.
I’ve a couple more questions though for clarification:
I’m assuming your header and footer are in the same file?
My wrapper is also contained in my header, but the header is separate from my footer. They are each in their own .php file, i.e., header.php & footer.php? Does this change how it needs to be done?
I’ve also read that the shadow.png needs to be the same color as the page background you are applying it to? My page background is white.
Is this correct or should I make the shadow a light gray color?
Appreciate all your help Shane. Thank you so much!
Evo
(@shane_tactical1)
hi mike,
sorry didnt get back to you sooner. I havent checked this for awhile. Been busy getting ready to go away for the holidays.
Dont know if you still need help or not but here goes.
What i normally do is this.
The wrapper starts in the header but ends in the footer file.
So it would be like this
Header file:
In the header file you would have the divs starting in here.
<div id”shadow”>
<div id=”wrapper”>
then you would close them in your footer.
</div> <!——–end wrapper——>
</div> <!——–end shadow——>
What kind of shadow did you want to add to your theme?
If you can send me a link to your website or maybe send me your theme zipped up i could add a shadow for you.
Evo
(@shane_tactical1)
I can show you how to make the shadow.png aswell.
I make mine in photoshop.
It would probably be easier to talk to you about all the above on msn so if you do want some help feel free to add me.
shane_tactical1 at hotmail dot com
obviously change the at to @ and the dot to .
