Hi all. Bear with me, im new to this css positioning! consider the following code:
body {
background-color: #CCCCCC;
}
#page {
background-color:#FFFFFF;
position: absolute;
left: 10%;
right: 10%;
top: 21px;
width: 799px;
height: auto;
}
#contact {
position: absolute;
top: 65px;
right: 21px;
}
#logo {
position: absolute;
top: 2px;
left: 2px;
}
#banner {
position: absolute;
top: 106px;
left: 2px;
}
.nav1 {
border-right: thin dotted #6633FF;
}
---------------------------------------------
<body>
<DIV id="page">
<DIV id="logo">
<img src="../logo.jpg" />
</DIV>
<DIV id="contact">
<table width="10%" height="31">
<tr>
<td class="nav1">Home</td>
<td>Contact</td>
</tr>
</table>
</DIV>
<DIV id="banner">
<img src="../banner.jpg" />
</DIV>
</DIV>
I have the body set as a gray colour.The main container's (page) background colour is set to white. Now as i am adding smaller containers that contain images, tables etc, they are showing up in all the right positions etc but the page container hasnt got the white background.it just appears transparent and the only present colour is the gray background from the body.Can anyone help me out as to why this is happening? if i remove the two containers (DIV id="logo" and DIV id="banner") from the images, the main container shows up with a white background!Please help! many thanks,
shamrock
