Link in sticky footer not clickable in Firefox and Chrome

Question

I am using a sticky footer like described in:

• How do you get the footer to stay at the bottom of a Web page?
• http://ryanfait.com/resources/footer-stic

Answer 1

I had similar problem in webkit browsers. Setting the z-index or position didn't solve the problem but after I set -webkit-transform:translate(0,0); the button is clickable again.

Answer 2

Correct me if I'm wrong but I think you should add a negative value for z-index which pushes it back enabling the link button.

This worked for me

.footer, .push {
    height: 4em;
    position: relative;
    width: 90%;
    margin: 0 auto;
    z-index: -9000;
}

Answer 3

Solved it, adding a postion:relative and z-indexes did it:

.push, .footer {
    height: 90px;
    position: relative;
}
.push {
    z-index: 9000;
    position: relative;
}
.footer {
    background: #181f18 url(../images/background-top.png) no-repeat center bottom;
    z-index: 9999;
    position: relative;
}