hey ive been learning CSS and attempting to make a website using html and css so far its been going pretty good but ive hit a snag.....
Ill try to explain as good as possible.
here is my code so far (no images just code so far)
html code:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Index</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div class="containter">
<div class="banner">Banner
</div>
<div class="nav">
<div align="center">Nav</div>
</div>
<div class="sidebar"></div>
<div class="sidebar">
<div align="center">SideBar</div>
</div>
</div>
<div class="content">Content</div>
</body>
</html>
And here is the CSS part of my website:
Code:
@charset "utf-8";
/* CSS Document */
html, body {
background-color: #2B2E2F;
margin-left: 0 auto;
margin-right: 0 auto;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
.banner {
border: 1px solid orange;
width:1000px;
height:100px;
position:absolute;
top:15px;
left:50%;
margin-left:-500px;
}
.nav {
border:1px solid orange;
width:825px;
height:35px;
position:absolute;
top:124px;
left:584px;
margin-left:-400px;
width: 828px;
}
.containter {
background-color:#FFFFFF;
width:1020px;
height:600px;
position:absolute;
left:839px;
margin-left:-510px;
}
.sidebar {
border:1px solid orange;
width:160px;
height:300px;
position:absolute;
top:124px;
left:87px;
margin-left:-75px;
}
.content {
border:1px solid orange;
width:826px;
height:200px;
position:absolute;
top:181px;
left:763px;
margin-left:-250px;
}
Ok I will explain my problem.
If you read the code you will see
well this is where my website's content goes in ( pretty obvious) but I want to add a footer (I want the footer to be called
) And I want the footer to move if the border of
gets bigger.
I hope I explained it well enough, please help!
Cheers
Cody