Reputation: 16639
I have a div nested inside another
<div id="wrapper">
<div id="left"></div>
<div id="right"></div>
<div id="footer"></div>
</div>
THE CSS is as
#wrapper{
width:800px;
}
#left{
float:left;
width: 200px;
}
#right{
float: left;
width: 600px;
}
#footer{
width:800px;
height: 20px;
}
How can i ensure that the footer stays at the bottom of the wrapper div?
Upvotes: 2
Views: 7606
Reputation: 1177
just use clear:both
#footer{
width:800px;
height: 20px;
clear:both
}
Upvotes: 4
Reputation: 67244
You can solve this by using positioning:
#wrapper{
width:800px;
height: 600px;
position: relative;
border: 1px solid #333;
}
#left{
float:left;
width: 200px;
}
#right{
float: left;
width: 600px;
}
#footer{
width:800px;
height: 20px;
position: absolute;
bottom: 0;
}
Upvotes: 1