Dynamic Div Height?

Hi,

I know this question has been posted before but I can’t seem to get this to work. I have a content div containing an image and a right floated table. I want the table to dictate the height of the content div instead of the image but I can’t get it to work. If you can please share.

Thanks,

J

/*begin code*/

/**/
* html .minwidth, * html .container, * html .content, * html .layout {
height:1px;
}
/**/

.width {
width:90%;
min-width:800px; /* CHANGED TO REMOVE BACKGROUND COLOR */
border:3px solid green;
margin:10px auto;
}

.container
{
border: 3px solid red;
}

#top
{
width: auto;
height: auto;
border: 3px solid blue;
}

#topnavcontainer
{
height: 98px;
padding: 5px;
border: 3px solid orange;
}

ul
{
padding: 0;
margin: 0;
list-style: none;
}

li
{
float: left;
position: relative;
padding-right: 5em;
font: 12px arial, verdana, lucida, sans-serif;
}

a#nosub:link
{
color: #9EAEBB;
text-decoration: none;
padding-right: 2em;
background: transparent url(“images/square_off.jpg”) right center no-repeat;
}

a#nosub:visited
{
color: #9EAEBB;
}

a#nosub:hover
{
color: #49677F;
text-decoration: none;
background: transparent url(“images/square_on.jpg”) right center no-repeat;
}

a#nosub:active
{
color: #9EAEBB;
}

li
{
color: #9EAEBB;
}

li ul
{
display: none;
position: absolute;
top: 1em;
left: 0;
}

li > ul
{
top: auto;
left: auto;
}

li:hover ul, li.over ul
{
display: block;
}
//subnav style
#nav li li{ margin: 0 0 .2em 0; }

#nav li li a
{
display: block;
color: #49677F;
background-color: #9EAEBB;
width: 5em;
padding: .2em .8em;
text-decoration: none;
}

#nav li li a:hover
{
background-color: #49677F;
color: #FFF;
text-decoration: none;
}

#sub li a
{
background-image: none;
}

#content
{
border: 3px solid black;
margin: 0px;
width: auto;
height: auto;
}

#thumbs
{
border: 3px solid red;
width: 202px;
float: right;
}

#thumblarge
{
border: 3px solid blue;
margin: 0px;
width: 520px;
padding: 0px;
}

#bottom
{
clear: both;
margin: 0;
border: 3px solid blue;
}

/*end code*/

Also in #CSS _↴