fmz 14

Okay so its not a question, but it certainly raises questions. I posted a question yesterday asking for advice on how to get my footer to stay stuck to the bottom. I followed the instructions and was very pleased with the results. That is, until I looked at the pages in IE7. Why does IE have to be so remarkably inconsistent. Anyway, I am now looking for help to figure out how to get my footer to cooperate.

You can see the said footer example here:

The html:

<div id="footer">
<div id="footer-content">
    <div id="contact-us">
        <p>Contact info here</p>
    <div id="contact-2">
        <p>phone and email here.</p>

    <div id="credits">
        <p><a href="terms.html">terms of use</a> | <a href="privacy.html">privacy policy</a><br />
        &copy;2010, JR&rsquo;s Landscaping, Inc. All rights reserved.<br />
        <a href="" target="_blank">Web Design by Monarch Marketing</a></p>


The CSS:

html, body, #container              { height: 100%; }
body > #container                   { height: auto; min-height: 100%; }
#content                            { padding-bottom: 80px; }
#footer                         { clear: both; position: relative; z-index: 10; height: 80px; margin-top: -80px;  background: #648824 url(../_images/bg_footer.jpg) repeat-x left top; }

Any help would be greatly appreciated.


1 answer

This was chosen as the best answer

you don't seem to have a div with id="content" but you have two divs with ID="main"

sort through your html again, and make sure it matches up with the tutorial.

FWIW I think this is a better sticky footer:

Answered about 8 years ago by Tony Crockford
  • Alas, I was in the process of implementing cssstickyfooter when you saw the page. It is all fixed and working now. Thanks. fmz about 8 years ago