|
wrapper not detecting content
i am not sure if the wrapper is detecting the child div's inside it, could someone check it out for me please
thanks
- Code: Select all
<!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" />
<title>Untitled Document</title>
<style type="text/css">
<!--
/*-------------------------------------------*/
/* layout ( non movers ) */
/*-------------------------------------------*/
#banner_con {
margin: 0 auto;
width:962px;
height:250px;
margin-top: 10px;
border:double #CCCCCC;
background-color:
}
#banner {
float:right;
width:662px;
height:195px;
margin: 5px 5px 5px 0;
background-color:#FFFFFF;
background-image:url(images/bannor.JPG);
}
#navigation {
float: left;
width:280px;
height:195px;
margin: 5px 10px 5px 5px;
background-color:#FFFFFF;
background-image:url(images/nav.JPG);
}
#bar {
float: left;
width:942px;
height:30px;
padding: 7px 10px 5px 10px;
background-image:url(images/bar.JPG);
}
#wrapper {
margin: 0 auto;
width:962px;
height:300px;
margin-top: 5px;
padding: 0 0 3px 0;
background-color:#D3D0C7;
border:double #CCCCCC;
}
#footer {
margin: 0 auto;
width:942px;
height:120px;
margin-top:5px;
margin-bottom:10px;
padding: 5px 10px 5px 10px;
background-color:#BB595A;
border:double #CCCCCC;
}
/*-------------------------------------------*/
/* layout ( movers ) */
/*-------------------------------------------*/
#column_left {
float:left;
height:50px;
width: 208px;
background-color:#FFFFFF;
margin: 10px 5px 5px 5px;
padding: 3px 5px 3px 5px;
border:double #CCCCCC;
}
#column_center_1{
width: 462px;
height:50px;
float: left;
background-color:#FFFFFF;
margin:10px 5px 5px 5px ;
padding: 3px 5px 3px 5px;
border:double #CCCCCC ;
}
#column_center_2{
width: 698px;
height:50px;
float: left;
background-color:#FFFFFF;
margin:10px 5px 5px 5px ;
padding: 3px 5px 3px 5px;
border:double #CCCCCC ;
}
#column_center_3{
width: 934px;
height:50px;
float: left;
background-color:#FFFFFF;
margin:10px 5px 5px 5px ;
padding: 3px 5px 3px 5px;
border:double #CCCCCC ;
}
#column_center_4{
width: 698px;
height:50px;
float: left;
background-color:#FFFFFF;
margin:10px 5px 5px 5px ;
padding: 3px 5px 3px 5px;
border:double #CCCCCC ;
}
#column_right{
float:right;
height:50px;
width: 208px;
background-color:#FFFFFF;
margin: 10px 5px 5px 5px;
padding: 3px 5px 3px 5px;
border:double #CCCCCC ;
}
/*-------------------------------------------*/
/* fonts and style */
/*-------------------------------------------*/
.breadcrumb {
font: Geneva, Arial, Helvetica, sans-serif;
color: #333333;
font-size:19px;
letter-spacing:10px;
font-variant:small-caps;
font-weight:bold;
}
-->
</style>
</head>
<body>
<div id="banner_con">
<div id="navigation"></div>
<div id="banner"></div>
<div class="breadcrumb" id="bar">home-forums-next</div>
</div>
<div id="wrapper">
<div id="column_center_4"></div>
<div id="column_right"></div>
</div>
<div id="footer"></div>
</body>
</html>
p.s - the height attributes are only there temporally
Last Blog Entry: Basic Advice for newbies (Feb 1st, 2008)
Last edited by saltedm8; Apr 6th, 2008 at 21:39.
|