根据子div的高度动态调整容器div的大小

Question

I'm trying to get a container div to be able to resize automatically depending on if certain child divs are present. This is my code so far, and when I remove the child divs the height of the parent container div remains the same.

http://jsfiddle.net/sm7L6fqy/3/

#containerdiv {
width: 400px;
height: 185px;
background-color: rgba(39, 39, 39, 0.89);
position: absolute;
display: block;
top: 73px;
z-index: 99;
color: white;
border-radius: 2px;
}
#childdiv1 {
margin-left: 5px;
font-weight: bold;
margin-top: 3px;
color: rgb(223, 114, 53);
}
#childdiv2 {
margin-left: 5px;
font-size: .95em;
margin-top: -3px;
}
#childdiv5 {
margin-left: 5px;
margin-top: 5px;
}
#childdiv6 {
margin-left: 5px;
margin-bottom: -1px;
position: relative;
padding: 100px 3px;
}
#childdiv7srcparent {
border: 1px solid white;
border-radius: 3px;
margin-left: 5px;
left: -2px;
position: absolute;
top: 32px;
}
#childdiv8 {
position: absolute;
top: 67px;
left: 5px;
}
#childdiv3 {
font-size: .95em;
color: rgb(136, 71, 255);
position: absolute;
top: 43px;
left: 5px;
}   
#childdiv4src {
font-size: .95em;
color: white;
text-decoration: none;
top: 3px;
position: absolute;
right: 5px;
}

Thanks

Answer 1

Change height and width of your #containerDiv to auto .

#containerdiv {
    width: auto;
    height: auto;
    background-color: rgba(39, 39, 39, 0.89);
    position: absolute;
    display: block;
    top: 73px;
    z-index: 99;
    color: white;
    border-radius: 2px;
}