Hi guys I wonder if you can help me out with a bit of code for my website, its not live yet but here's the code and an screen shot of the site. I hope this is enough to go on as I can't make it live as of yet.
The problem is as follows, on the right hand side I have an image called
#shadowedgepageright and it is supposed to display the same as
#shadowedgepage but doesn't i think that something is blocking it to do with a float maybe but I can't be sure.
Image :
Full size image:
http://img156.imageshack.us/img156/7200/problemv.png
Code html:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="StyleSheet" href="styles.css" type="text/css">
</head>
<body background="images/backgroundimage.jpg">
<div id="firstpixeltop"></div><!-- part 1 of the 2px line at the top of page -->
<div id="secondpixeltop"></div><!-- part 2 of the 2px line at the top of page -->
<div id="wrapper"><!-- content wrapper for page -->
<div id="shadowedgepage"></div><!-- left shadow of white page background down sides -->
<div id="page"></div><!--white page css white background -->
<div id="navigationandlogo"><!-- holds nav logo and call us -->
<div id="callus"><!-- call us holder and 2px line between call us and nav -->
<div id="teleimage"></div><!--holds the call us number image -->
<div id="1pxbelcall"></div><div id="2pxbelcall"></div><div id="navigation">
<ul id="navlist">
<li><a href="#">Homepage</a></li>
<li><a href="#">HGV License</a></li>
<li><a href="#">Theory Test</a></li>
<li><a href="#">Contact Us</a></li>
<li><a href="#">About</a></li>
</ul></div>
</div>
<div id="logo"></div><!-- logo -->
</div><!--logo holder -->
<div id="bannerholder">
<div id="bannerimage"></div></div>
<div id="shadowedgepageright"></div><!-- left shadow of white page background down sides -->
</div>
</body>
</html>
Code CSS:
Code:
@charset "utf-8";
/* CSS Document */
#firstpixeltop {
height:1px;
width:auto;
background-color:#dae7f9;
background-repeat:repeat-x;}
#secondpixeltop {
height:1px;
width:auto;
background-color:#b6bac0;
background-repeat:repeat-x;}
/*Content Wrap For Website*/
#wrapper {width:1031px;
height:1031px;
margin: 0 auto;}
#shadowedgepage {
width:8px;
float:left;
height:628px;
background-image:url(images/leftshadowborder.jpg);
background-repeat:repeat-y;}
#page {
background-color:#f4f4f4;
float:left;
width:1015px;
overflow:hidden;
height:1px;
background-repeat:repeat-x;}
#navigationandlogo {
width:1015px;
float:left;
height:126px;
}
#logo {
background-image:url(images/logo.jpg);
width:369px;
height:118px;
padding-top:10px;}
#callus {
width:646px;
float:left;
background-color:#f4f4f4;
margin-left:369px;
height:69px;}
/*navigation button attributes*/
a {
font:normal 13px Arial;
color:#747d86;
font-size:14px;
font:Arial, Helvetica, sans-serif;
font-weight:bold;
background-color:f4f4f4;
text-decoration:none;
text-transform:uppercase;
padding-right:30px;
float:left;}
a:hover {font:normal 13px Arial;
color:#000000;
font-size:14px;
background-color:f4f4f4;
font:Arial, Helvetica, sans-serif;
font-weight:bold;
text-transform:uppercase;
text-decoration:none;
padding-right:30px;
float:left;}
#navlist li
{
display: inline;
list-style-type: none;
background-color:f4f4f4;
}
#navigation {
padding-left:30px;
padding-top:15px;
width:616px;
height:47px;
background-color:#f4f4f4;}
/* end -navigation button attributes - end */
#teleimage {
background-image:url(images/callus.jpg);
margin-left:66px;
width:336px;
height:66px;}
#1pxbelcall {
height:1px;
width:487px;
margin-left:67px;
background-color:#e3e3e3;}
#2pxbelcall {
height:1px;
width:487px;
margin-left:67px;
background-color:#fafafa;}
#bannerimage {
background-image:url(images/bannerimage.png);
width:962px;
margin-left:27px;
float:left;
background-color:#f4f4f4;
height:420px;}
#bannerholder {width:1015px;
float:left;
height:420px;
background-color:#f4f4f4;
}
#shadowedgepageright {
float:left;
width:8px;
height:528px;
background-image:url(images/rightshadowborder.jpg);
background-repeat:repeat-y;}
Any help would be much appreciated, Thanks.