How to have footer always at the bottom of page?

My page doesn't contain a lot of information, so footer is displayed somewhere in the middle of the page. How can 开发者_开发百科I have that always at the bottom?

jquery mobile approach - <div data-role="footer" data-position="fixed">

{
  potition: absolute;
  bottom: 0;
  width: 100%;
  height: some_height;
}

This isn't a fixed position footer. The footer will be offscreen if the page content is taller than the screen. I think it looks better this way.

The body and .ui-page min-height and height are necessary to prevent the footer from jumping up and down during transitions.

Works with the latest JQM version as of now, 1.4.0

body,
.ui-page {
    min-height:100% !important;
    height:auto !important;
}

.ui-content {
    margin-bottom:42px; /* HEIGHT OF YOUR FOOTER */
}

.ui-footer {
    position:absolute !important;
    width:100%;
    bottom:0;
}

[data-role=page]{height: 100% !important; position:relative !important;}
[data-role=footer]{bottom:0; position:absolute !important; top: auto !important; width:100%;}