Responsive Bootstrap Sticky Footer Height

Question

When the window is resized, the height of the footer expands but not the background color. Help!

http://twitter.github.io/bootstrap/examples/sticky-footer.html

Quench

Answer 1

height: auto seems to solve the problem. You can include it with a media query for small viewports:

@media only screen and (max-device-width: 480px) {
    #footer {
        height: auto;
    }
}

Isoelectronic

This doesn't seem to work anymore with the latest version of Bootstrap? – Desmund

I cannot reproduce the original issue with the latest version of Bootstrap, could you please report what OS and browser are you using? – Isoelectronic

Windows 8, Chrome 37.0.2062.120 m – Desmund

Probably because the viewport max width is emulated. – Desmund

Answer 2

Your demo doesn't work anymore but the best Bootstrap sticky footer I've found is: https://gist.github.com/aalaap/3066704

Amontillado

The example is still online but the URL changed: getbootstrap.com/examples/sticky-footer-navbar – Tours

@Tours As mentioned below - the bootstrap example uses a fixed height and is not responsive. – Winograd

@ShyamalParikh Yes, it does. You're welcome to post a link to a fiddle with an example where you can't get it to work and I'm sure someone will be able to help you get it working. – Amontillado