I have a stack of divs inside of each other, all of which have an
ID which specifies CSS only.
But for some reason
the surrounding DIV tag only expands to it's anointed height value, and not it's default auto, meaning that although
the content is inside,
the backing DIV is only a specific height. I need it to adjust
the heigh to
the size of whatever is inside of it (As there will be user submitted data being echoed out possibly in paragraphs with 500+ words.)
Here is my HTML
<div id="albumhold">
<div id="albumpic">Pic here</div>
<div id="infohold">
<div id="albumhead">Name | Date</div>
<div id="albuminfo">Information</div>
</div>
And
the CSS for
the HTML code:
#albumhold {
width: 920px;
padding: 10px;
height: auto;
border: 1px solid #E1E1E1;
margin-left: auto;
margin-right: auto;
background-color: #E1E1E1;
background-image: url(../global-images/albumback.png);
background-position: top center;
background-repeat: repeat-x;
}
#albumpic {
display: block;
height: 110px;
width: 110px;
float: left;
border: 1px solid #000;
}
#infohold {
width: 800px;
background-color: #CCC;
float: right;
height: 20px;
}
#albumhead {
width: 800px;
height: 20px;
text-indent: 10px;
border: 1px solid #000;
color: #09F;
}
#albuminfo {
margin-top: 5px;
width: 800px;
float: right;
color: #09F;
word-wrap:break-word;
}
Help is greatly appreciated.
