|
Posted by asaffos on 12/26/07 18:44
Hi,
In the code below I have a certain color for the body, a different one
for the content_body. For some reason although the DIV for the
content_body has all of the pages content in it the background color
appears in a certain part on the top of the page. Why is that? (the
css is also below)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>
</title>
<link rel="stylesheet" href="style.css" type="text/css"
media="screen" />
</head>
<body>
<div id="body_wrapper">
<div id="content_body">
<div id="nav_menu">
</div>
<div id="right_col">
</div>
</div>
</div>
</body>
</html>
******************************
CSS
******************************
body {
padding: 10px 0px 10px;
background-color: #484848;
color: #fff;
font-family: verdana, arial, sans-serif;
font-size: 12px;
text-align: center;
}
#body_wrapper {
margin: 0px auto;
padding: 2px 0px;
width: 777px;
background-color: #fcfcfc;
color: inherit;
text-align: left;
}
#content_body {
margin: 0px 2px;
padding: 17px 12px 15px 15px;
background-color: #dddacc;
border-bottom: #fff 2px solid;
color: #000000;
text-align: left;
}
#nav_menu {
margin: 72px 12px 10px 2px;
width: 180px;
background-color: #dddaaa;
color: #fff;
border-bottom: #fff 2px solid;
font-family: arial, sans-serif;
font-weight: bold;
letter-spacing: 1px;
text-transform: uppercase;
float:left;
}
#right_col
{
width:540px;
float:right;
}
[Back to original message]
|