Sopov.com freelancer, html and css tips and tricks

How to place footer at bottom?

This means that the footer area will always be placed on the bottom of the page, even if there is little content. I checked this code in MAC: FF, Safari; PC: IE 6/7/8, FF, GChrome

CSS Code:

* {
margin: 0;
padding: 0;
}

html, body {
height: 100%;
}

#wrap {
position: relative;
min-height: 100%;
}

* html #wrap {
height: 100%;
}

#wrapContent {
padding-bottom: 100px;
}

#footer {
position: relative;
height: 80px;
margin-top: -80px;
background: #000;
}

HTML Code:

<div id="wrap">
    <div id="wrapContent">
        Content text
    </div>
</div>

<div id="footer">
    Footer text
</div>

I hope it will help :)