Sticky footer problems

[palimadra]

I tried the sticky footer technique of Ryan from http://ryanfait.com/resources/footer-stick-to-bottom-of-page/

When I view the code as it is it works fine. However, when I add font-size: 4em; to the .wrapper (wrapper class) the footer moves to the middle of the page. I’m using Chrome 21.0.1180.60 m and I have tried in the Firefox 14.0.1. Both of them have a problem.

Can someone help me understand what is going on here?

[Paulie_D]

It depends on what is in your footer and the code that goes with it.

Do you have a link?

[Manojnaanak]

apply it …

.footer {
position: fixed;
bottom:0;
width: 100%;
background: #999;
height: 180px;
text-align: center;
}

[trinzia]

I had some issues with that too. I wanted fluid or fixed height header and footer, and also to be able to stick two items to the bottom instead of one. Here is one method: http://instancia.net/?p=196
It works by using the table-row property, and setting the content row to 100%.
(Please nevermind the mess on my site, I was tinkering.)

[Author]

Posts