We'd like to remind Forumites to please avoid political debate on the Forum... Read More »
We're aware that some users are experiencing technical issues which the team are working to resolve. See the Community Noticeboard for more info. Thank you for your patience.
📨 Have you signed up to the Forum's new Email Digest yet? Get a selection of trending threads sent straight to your inbox daily, weekly or monthly!
Any website coding experts?
Options

Drea
Posts: 9,892 Forumite
in Techie Stuff
Hiya,
This might be a longshot but I was hoping that someone could help me with a problem I'm having with my website.
www.animalstation.co.uk - I've been trying to code it myself (and mainly failing :rotfl:) but one thing that is really bugging me is that I can't seem to keep my drop shadow at the sides of the layout when I add the main content div. I tried creating two sidebar divs to put the drop shadow picture in but that didn't seem to work.
I'd really appreciate it if anyone had any ideas
Thanks!
This might be a longshot but I was hoping that someone could help me with a problem I'm having with my website.
www.animalstation.co.uk - I've been trying to code it myself (and mainly failing :rotfl:) but one thing that is really bugging me is that I can't seem to keep my drop shadow at the sides of the layout when I add the main content div. I tried creating two sidebar divs to put the drop shadow picture in but that didn't seem to work.
I'd really appreciate it if anyone had any ideas

Thanks!
Just because you made a mistake doesn't mean you are a mistake.
0
Comments
-
Try wrapping a new div around the content div, with a background image of a 5px tall white bar with drop shadow to left and right edges. (see example in quote box below - if you save this image it is the correct size - but has been scaled down by the forum)
#content-bg {
width: 850px;
background: url(../images/content-bg.png) scroll top repeat-y;
}How do I add a signature?0 -
Also in the <head> section, remove:
<style type="text/css" media="all">@import "css/master.css";</style> <style type="text/css" media="all">@import "css/master.css";</style>
and replace with:
<link href="css/master.css" rel="stylesheet" type="text/css" media="all />
which is a better way of linking to an external style sheetHow do I add a signature?0 -
Try wrapping a new div around the content div, with a background image of a 5px tall white bar with drop shadow to left and right edges. (see example in quote box below - if you save this image it is the correct size - but has been scaled down by the forum)
#content-bg {
width: 850px;
background: url(../images/content-bg.png) scroll top repeat-y;
}Also in the <head> section, remove:
<style type="text/css" media="all">@import "css/master.css";</style> <style type="text/css" media="all">@import "css/master.css";</style>
and replace with:
<link href="css/master.css" rel="stylesheet" type="text/css" media="all />
which is a better way of linking to an external style sheet
Doesn't seem to workalthough I'm not sure what you mean by wrapping a new div around it?
Will change the second part now, thanksJust because you made a mistake doesn't mean you are a mistake.0 -
Oh noo changing the second part has messed it all up :rotfl: I'm out of my depth...Just because you made a mistake doesn't mean you are a mistake.0
-
Add the css I included above in your style sheet. Save the image to your images folder. Then edit the page to add the bits in blue above and below the content div
<div id="content-bg">
<div id="content">Testing.........
</div>
</div>How do I add a signature?0 -
Add the css I included above in your style sheet. Save the image to your images folder. Then edit the page to add the bits in blue above and below the content div
<div id="content-bg">
<div id="content">Testing.........
</div>
</div>
Thank you so much! That has been driving me bananas! You're a starJust because you made a mistake doesn't mean you are a mistake.0 -
That looks better. Now edit your footer.png to add a 5 px white bar at the top with drop shadow to left, right and below. This will create a gap below your content.
Adjust the margins of your content div to put some white space down the left margin.How do I add a signature?0 -
That looks better. Now edit your footer.png to add a 5 px white bar at the top with drop shadow to left, right and below. This will create a gap below your content.
Adjust the margins of your content div to put some white space down the left margin.
Did the margins but will have to wait until I get home from work before I can change the picture
Thanks!Just because you made a mistake doesn't mean you are a mistake.0 -
Try this for size:
ETA: don't forget to get rid of the superfluous sidebar divsHow do I add a signature?0
This discussion has been closed.
Confirm your email address to Create Threads and Reply

Categories
- All Categories
- 351K Banking & Borrowing
- 253.1K Reduce Debt & Boost Income
- 453.6K Spending & Discounts
- 244K Work, Benefits & Business
- 598.8K Mortgages, Homes & Bills
- 176.9K Life & Family
- 257.3K Travel & Transport
- 1.5M Hobbies & Leisure
- 16.1K Discuss & Feedback
- 37.6K Read-Only Boards