# CSS... div autosize table cell vertically?

**URL:** <https://forum.kirupa.com/t/css-div-autosize-table-cell-vertically/192160>\
**Category:** web dev\
**Created:** [June 26, 2006, 5:50pm UTC](https://forum.kirupa.com/t/css-div-autosize-table-cell-vertically/192160 "2006-06-26T17:50:02Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![woodman650](https://avatars.discourse-cdn.com/v4/letter/w/b9bd4f/32.png) [@woodman650](https://forum.kirupa.com/u/woodman650)\
**Post date:** [June 26, 2006, 5:50pm UTC](https://forum.kirupa.com/t/css-div-autosize-table-cell-vertically/192160/1 "2006-06-26T17:50:02Z")

</div>

Hey all,  
Kind of a random question… but I’ve got a header, a body, and a footer, all each in their own table cells. I’d like the footer to stay at the bottom of the browser window and have the main body cell, containing the “body div” resize accordingly. does anyone know how I can do this?

```auto
 
<table width="735" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td height="144"><div id="headercontent">header content</div>
 
 </td>
  </tr>
  <tr>
    <td height="100%" valign="top" background="img/yscroll.jpg"><div id="bodycontent">body content here. lllllll</div></td>
  </tr>
  <tr>
    <td height="79" valign="top"><div id="footercontent">footer content</div></td>
  </tr>
</table>

```

my css looks like:

```auto
 
#headercontent {
 width: 733px;
 height: 144px;
 background: url(../img/head.jpg);
 background-repeat: no-repeat;
}
#bodycontent {
 font-family: Verdana, Arial, Helvetica;
 font-size: 10.5px;
 width: 733px;
 height: 100%;
 text-align: left;
}
#footercontent {
 width: 733px;
 height: 75px;
 margin-left: -1px;
    margin-right: auto;
 background: url(../img/footer.jpg);
 background-repeat: no-repeat;
}

```

thanks a bunch
