...

View Full Version : My footer and content are showing up. My sidebar doesn't touch my header



Mccall101
05-11-2009, 05:24 AM
Heres my site http://www.stylishknockouts.com

heres my html and css


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="shortcut icon" href="/favicon-1.ico">
<title>Stylish Knockouts!</title>
<meta http-equiv="Content-Type" content="text/html" charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="Knockout.css" />
</head>
<body id="home">
<div id="outer">
<div id="header">
</div>

<ul id=""nav">
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
</ul>
<div id="main">
<div id="content" class="clearfix">
<div id="col1"></div>
<div id="maincol"></div>
<div id="footer"></div>
</div>
</div>
</body>
</html>



html, body{
margin:0;
padding: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
border-left: 0;
background:#FFFFFFF;
}

#outer{
width: 1024px;
margin:auto;
text-align:left;
}

#header{
width:1024px;
height: 227px;
background:url(http://www.stylishknockouts.com/images2/Header.jpg) no-repeat;
}

ul#nav{
width: 244px;
font-size: 92%;
padding: 18px 115px 5px 0;
text-align:right;
}

#col1{
width:244px;
height:634px;
background:url(http://www.stylishknockouts.com/images2/Navigation.jpg) no-repeat;

}

#footer{
position: center;
width: 1024px;
height: 136px;
padding: 20px 0 0 0;
background:url (http://www.stylishknockouts.com/images2/Footer.jpg) no-repeat 0 0;
clear:both;
}

#maincol{
width:780px;
height:634px;
background:url(images2/Content.jpg) no-repeat;
border: 1px;
}

abduraooft
05-11-2009, 09:22 AM
Have a look at http://bonrouge.com/2c-hf-fluid.php

Mccall101
05-11-2009, 04:16 PM
I meant my foot and content aren't showing up

Excavator
05-11-2009, 04:28 PM
Mccall101,
The validator shows why. Have a look at the links about validation in my sig below.
Compare this code to yours -
<!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">
html, body{
font-size: 100%;
background: #FFFFFF;
}
* {
margin: 0;
padding: 0;
}
#outer{
width: 1024px;
margin: 0 auto;
text-align: left;
}
#header{
width: 1024px;
height: 227px;
background: url(http://www.stylishknockouts.com/images2/Header.jpg) no-repeat;
}
ul#nav{
width: 244px;
margin: 18px 0 0 0;
font-size: 92%;
text-align: center;
}
#col1{
width: 244px;
height: 634px;
float: left;
background: url(http://www.stylishknockouts.com/images2/Navigation.jpg) no-repeat;
}
#maincol{
width: 780px;
height: 634px;
margin: 0 0 0 244px;
background: url(images2/Content.jpg) no-repeat;
}
#footer{
width: 1024px;
height: 136px;
padding: 20px 0 0 0;
background: #000 url(http://www.stylishknockouts.com/images2/Footer.jpg) no-repeat;
clear: both;
}
</style>
</head>
<body>
<div id="outer">
<div id="header"></div>
<div id="content">
<div id="col1">
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
</ul>
<!--end col1--></div>
<div id="maincol">
<!--end maincol--></div>
<!--end content--></div>
<div id="footer"></div>
<!--end outer--></div>
</body>
</html>


Your's has things like background:#FFFFFFF; (7 F's instead of 6 or 3)
and <ul id=""nav"> (double quote marks)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum