In such a case, if you're using a tabless design and positioning DIVs using CSS, the footer will ride up right under the short content instead of being at the bottom of the page.
On a new site I'm working on, I ran into this. Rather than resort to the old stanrd of using a three row table, I want to position my footer using CSS only.
You can read the full post by following the the link in this post's title, but here's the code to position a DIV at the bottom of a page, regardless of how long the page content is (I've checked it in IE 6 and FF 1.5).
The CSS styles:
html {height: 100%;}
body {height: 100%;}
#nonFooter {position: relative;min-height: 100%;}
* html #nonFooter {height: 100%;}
#footer {position: relative;margin-top: -7.5em;}The HTML:<html>
<body>
<div id="nonFooter">
main content
</div>
<div id="footer">
footer content
</div>
</body>
</html>
No comments:
Post a Comment