Page Widget How to - Keep footer always at the bottom of a page








Question

We would like to know how to keep footer always at the bottom of a page.

Answer


<!DOCTYPE html>
<html>
<head>
    <style>
        body { height: 100%;}
        footer {background: url(http://www.java2s.com/style/download.png); 
                position: fixed; bottom: 0; left: 0; height:115px;width:100%; }
    </style>
</head><!-- ww w .ja v a  2s. co m-->
<body>
    <footer>

    </footer>
</body>
</html>

The code above is rendered as follows: