The Most Active and Friendliest
Affiliate Marketing Community Online!

“AdsEmpire”/  Direct Affiliate

How to make....

fixed header / footer

here is the code for your question
<!-- IE in quirks mode -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<title>Fixed header and footer</title>
<style type="text/css">
body{
margin:0;
padding:header-<length> 0 footer-<length> 0;
}
div#header{
position:absolute;
top:0;
left:0;
width:100%;
height:header-<length>;
}
div#footer{
position:absolute;
bottom:0;
left:0;
width:100%;
height:footer-<length>;
}
@media screen{
body>div#header{
position:fixed;
}
body>div#footer{
position:fixed;
}
}
* html body{
overflow:hidden;
}
* html div#content{
height:100%;
overflow:auto;
}
</style>
<div id="header"> header </div>
<div id="footer"> footer </div>
<div id="content"> content </div>:thumbsup:
 
I always create headers/footers using scripting languages like PHP or ASP.net. That way you can re-use the same piece of code for all pages and if you need to change the header or footer you only need to make the change once instead of for every page.
 
I always create headers/footers using scripting languages like PHP or ASP.net. That way you can re-use the same piece of code for all pages and if you need to change the header or footer you only need to make the change once instead of for every page.
I agree. Better use header.php and footer.php. You'll then have to edit only these 2 files.
Hope this helps :)
 
Creating a web layout with a fixed header and footer is quite easy in your modern browsers like Firefox, IE7/IE8, Opera, Safari, Chrome, etc. It's simply done by using the CSS property declaration position: fixed. Unfortunately,browser IE6 does not support the fixed value, and treats it as if it were position: static which is far from the results that position: fixed achieves.
 
MI
Back