I have 4 divs. One is outer wrapper, and other 3 are header, content and footer respectively. All the are of same(fixed) width. But height of outer wrapper and content div are variable.
irrespective of the size of these, i want the footer div to stick at the bottom of outer wrapper. I have tried using the following CSS
To align a div to bottom, you have to first make the parent div's position relative. then make the required div's position to absolute and set the bottom property to zero.
<div style="position: relative; height: 100px; border: solid;"> <div style="position: absolute; height: 10px; border: solid; bottom: 0; right: 0; left: 0; "> </div> </div>