Search code examples
sticky-footer

Content going under footer in Google Chrome and not FF

If you take a look at the site in Firefox, everything will appear normal and the footer will stick to the bottom. However in Google Chrome, the footer sticks to the bottom, but the content goes under it if the window is not large enough.

I've spent the last three hours trying to fix it, I would really appreciate it if anybody knows the solution.

Here is the site: http://rawonline.com.au/clarkwindows/service.html

Solution

  • Change your #footerWrap CSS to this:

    #footerWrap {
    height: 277px;
    background: url(images/footerbg.png) left 277px repeat-x; /* AMEND THIS */
    width: 100%;
    float: left;
    padding-top: 277px; /* ADD THIS */
}

    *EDIT*

    Ok, in that case, what you need to do is
    Move your <div class="push"> inside the <div id="wrapper">
    and change .push to:

    .push {
    height: 277px;
    clear: both;
}

    Also, add position: relative to wrapper and footerWrap