...And then I purchased a monitor that wasn't from 2002.
Actually, everything still looks great but the footer is RIGHT beneath the body of the page. I looked up the tutorials for a "sticky" footer, but none seem to work.
HTML:
<body> <div id="bg"> <div class="wrap"> (Content...) </div> <!-- footer --> <div id="footer"> <div id="footerbg"> <!-- footer links --><!-- /footer links --> <p id="copy"><span>Company Name</span></p> <div class="clear"></div> </div> </div> <!-- /footer --> </div> </body> </html>
CSS:
body {
font: .8em Arial, Verdana, Tahoma, Sans-Serif;
background: #f4f4f4 url(../images/bgtile.jpg) repeat-x;
color: #555;
}
#bg {
background: url(../images/bg.jpg) no-repeat center top;
}
.wrap {
margin: 0 auto;
width: 960px;
height: 100%;
}
/* footer */
#footer {
clear: both;
color: #999;
background: url(../images/footertile.jpg) repeat-x;
font-size: .9em;
clear:both;
}
#footerbg {
padding: 35px 0 15px 0;
background: url(../images/footer.jpg) no-repeat center top;
}
#footer p {
margin: 0 0 12px;
padding: 6px 0;
text-align: center;
}
#footer_menu {
float: right;
padding: 4px 0 0;
}
#footer a {
color: #999;
margin: 0 5px 0 0;
padding: 6px 10px;
background: url(../images/dot.png) no-repeat left center;
border: 1px solid transparent;
}
#footer a:hover {
border-color: #555;
}
#fleft {
clear: both;
padding: 25px 0 0;
font-size: .94em;
}
#copy {
color: #777; font-size: 1.5em;
}
#copy span {
color: #999;
text-align: center;
}Any help would be greatly appreciated! Also, an explanation of the code would help immensely, as this is part of a school project, and the point of it is to learn.
Sign In
Create Account
