invalid4564
Programmer
I created a drop shadow for my website but when i resize browser the contents move away from the drop shadow.
How do i keep webpage contents on top of drop shadow?
I've also attached the image that i am using.
Thank you for your help.
How do i keep webpage contents on top of drop shadow?
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml"[/URL] lang="en" xml:lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<link rel="stylesheet" type="text/css" href="default.css" />
<title>Website</title>
</head>
<body>
<div id="header">
</div>
<div id="navbar">
<table>
<tr>
<td class="active"><a href="#">Home</a></td>
<td><a href="">About</a></td>
<td><a href="">Contact</a></td>
</tr>
</table>
</div>
<div id="wrap">
<div id="main">
</div>
</div>
<div id="footer">
<p>© 2010-2011 All Rights Reserved.</p>
</div>
</body>
</html>
CSS:
body
{
width:840px;
height:700px;
background:#eeecd6 url('images/bg.jpg') no-repeat; /* drop shadow image */
margin:20px auto;
font-family:"San Serif",Times,Arial;
}
#header{width:840px;height:136px;margin:0 auto;background:#ffffff;border:1px solid #000000;}
#navbar
{
width:840px;
height:30px;
background:#ffffff;
border:1px solid #000000;
clear:both;
}
#navbar table{margin:0 auto;float:left;border:0;padding-left:20px;}
#navbar td{text-align:left;padding-right:10px;}
#wrap{width:840px;height:630px;margin:0 auto;background:#063e72;border:1px solid #000000;}
#main
{
width:800px;
height:600px;
margin:0 auto;
background-color:#ffffff;
border:1px solid #000000;
overflow:auto;
}
#footer
{
height:26px;
width:800px;
margin:0 auto;
text-align:center;
color:#000000;
background-color:#eeecd6;
font-size:small;
}
a:link{text-decoration:none;color:#000000;}
a:visited{text-decoration:none;color:#000000;}
a:hover{text-decoration:underline;color:#f1a629;}
a:active{text-decoration:underline;color:#f1a629;}
I've also attached the image that i am using.
Thank you for your help.