Question

How can I resize a Div on window resize, which the div is in between other div’s and I can’t think of how; but I want that div; to have a height; so that its beneath div; is shown as footer.

Ok I know that what I said doesn’t make sense but here is what I meat: http://i44.tinypic.com/9v8t1u.jpg

In other words, I am trying to do what http://www.tumblr.com has done on their index. The ’30 reasons you’ll love Tumblr’ is not positioned as absolute and bottom 0, but they’ve set overflow to hidden, and they change the height of the middle div everytime a window resizes.

I am using jQuery as well.

It’s not that I am lacking of coding skills but I just can’t think of a way to perform the Div3 is always shown as a footer.

Does anyone know how to do this?

Thanks alot

Answer 1

You don’t really need jQuery for this. Check out this css solution: http://ryanfait.com/sticky-footer/

* {
margin: 0;
}
html, body {
    height: 100%;
}
.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -142px; /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
    height: 142px; /* .push must be the same height as .footer */
}

/*

Sticky Footer by Ryan Fait
http://ryanfait.com/

*/