make css footer stay under content

Question

I have this css:

.lh_container {
    width:960px;
    margin:0 auto 40px auto;
    position:relative;
}

.lh_footer {
    position:absolute;
    bottom:0;
    width:100%;
    height:60px;            /* Height of the footer */
    background:#6cf;
}

.lh_footer-container {
    display:block;
    width:80%;
    margin: 0 auto;
    overflow: hidden;
}

and this HTML:

<div class="lh_container">

<div class="lh_footer">
    <div class="lh_footer-container">

    <div class="lh_footer_text">
    &copy; Copyright <?php echo date("Y"); ?>
    </div>

    </div>
</div>

</div><!-- container -->

but the footer will not stay at the bottom of the page - how can i achieve this?

Does this help: http://stackoverflow.com/questions/971123/css-fixed-to-bottom-and-centered — 97ldave, Oct 03 '13 at 21:30
i have tried this - http://jsfiddle.net/cN8DQ/ - but still the same :( — user2710234, Oct 03 '13 at 21:40

score 3 · Answer 1 · answered Oct 03 '13 at 21:31

3

Use fixed instead of absolute.

http://jsfiddle.net/pnLyh/

answered Oct 03 '13 at 21:31

elkirkmo

80
7

make css footer stay under content

1 Answers1