CSS #wrapper background color don't show up
Posted: Mon Apr 04, 2005 3:01 pm
I'm creating a page that somehow all the DIVs are not showing up correctly inside the wrapper. It looks right in Dreamweaver MX 2004 but when actually previewing the page, the background of the wrapper does not show through and only the background of the body is showing instead. Below are my codes:
in the CSS file:
And here is the Body of the html file:
Any help is appreciated.
ljCharlie
in the CSS file:
Code: Select all
#wrapper {
margin-left:auto;
margin-right:auto;
width: 720px;
background: #FFFFFF;
border: thin solid #FF0000;
position: relative;
}
#topLogo {
background-color: #000066;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 20px;
font-style: normal;
font-weight: bolder;
color: #FFFFFF;
padding-left: 5px;
padding-top: 5px;
}
#logoTag {
background-color: #000066;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
font-style: italic;
font-weight: bold;
color: #CCCCCC;
text-align: right;
padding-right: 5px;
padding-bottom: 5px;
}
#topHMenu {
background-color: #FF6600;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: normal;
color: #FFFFFF;
padding-left: 5px;
height: 25px;
}
#wrapper {
margin-left:auto;
margin-right:auto;
width: 720px;
background: #FFFFFF;
border: thin solid #FF0000;
position: relative;
}
#leftSideVMenu {
background-color: #FF9900;
width: 180px;
padding-left: 5px;
float: left;
}
#centerMainContent {
padding-left: 5px;
text-align: left;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: normal;
float: left;
width: 386px;
}
#rightSidePic {
float: right;
width: 144px;
}Code: Select all
<body>
<!-- #wrapper start here -->
<div id="e;wrapper"e;>
<div id="e;topLogo"e;>My Log Goes Here</div>
<div id="e;logoTag"e;>This is the tag of my logo.</div>
<div id="e;topHMenu"e;>Menu goes here</div>
<!-- #pagecontent start here -->
<div id="e;pagecontent"e;>
<!-- #sideMenu start here -->
<div id="e;leftSideVMenu"e;>
<p>ABOUT Page</p>
<p>WELCOME</p>
<p>HISTORY</p>
<p>MISSION</p>
<p>GOALS</p>
<p>VISION</p>
<p>STAFF</p>
</div>
<!-- #sideMenu end here -->
<!-- #mainContent start here -->
<div id="e;centerMainContent"e;>
<p>Main body texts goes here.</p>
</div>
<!-- #mainContent end here -->
<div id="e;rightSidePic"e;><img src="e;images/aboutfnd1.jpg"e; /></div>
</div>
<!-- #pagecontent end here -->
</div>
<!-- #wrapper end here -->
</body>ljCharlie