Sticky Footer

Can not get my footer to stick to bottom of view port:

html {
font-family: Arial, sans-serif;
height:100%;
}

body{
margin: 0 auto;
padding: 0;
font-size: 12px;
height:100%;
}

#container {
width:995px;
margin: 0 auto;
padding: 0;
min-height:100%;
position:relative;
background:#fff;
}

#innerContainer {
width:985px;
min-height:100%;
padding:5px;
margin:0 0 50px 0;
float:left;
}

.leftcol {
width: 190px;
float:left;
padding: 0 10px 0 0;

}

.centercol-home {
float: left;
width: 785px;
padding:0 0 50px 0;
background:#fff;
}

then here is what i have messed with the footer:

.new-footer{
width:995px;
margin:0 auto;
text-align: center;
bottom:0;
position:fixed;
padding:5px 0 5px 0;
background:#c4c4c4;
clear:both;
}

HTML

<body>
<div id="container">

<div id="innerContainer">



<div class="leftcol">
</div>

<div class="centercol-home">
</div>

</div>



</div>

</body>

it seems to end up off the screen to the right...?

Sticky Footer

Wants to shift to the right of containers

tonynoriega

limbo

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week