Ändern CSS dynamisch nach seiner inneren Elemente

Question

Gerade in meinem Code http://jsfiddle.net/rkumarnirmal/GXAYa/6/

#box_bg die äußere graue Box und #box ist die innere Blackbox. Ich benutzte Jquery Akkordeon in der #box. Was ich brauche ist #box_bg sollte dynamisch vergrößern oder verkleinern seine Höhe nach der Größe der inneren #box.

Konnte mir jemand helfen?

Danke!

Answer 1

eine absolute Höhe nicht Sie angeben: nur height:auto verwenden. Mit einer statischen Position von #box und etwas Polsterung für den Rahmen wird die #box_bg Größe automatisch auf seinen Inhalt angepasst.

Siehe http://jsfiddle.net/GXAYa/18/

Answer 2

Ändern Sie height:260px; zu height:auto;.

UPD: In position:relative zum #box

Answer 3

Ich bin nicht sicher, warum Sie die Position benötigen: absolute, so versuchen Sie dies als eine Option und sehen, ob es das Problem löst:

#box_bg { 
cursor: move; 
background-color: #4f575e; 
border-radius: 10px; 
-moz-box-shadow: 3px 3px 5px 6px #00000; 
-webkit-box-shadow: 0px 3px 5px 6px #00000; 
box-shadow: 0px -3px 3px 1px #4f575e; 
    overflow: hidden; 
width: 245px; 
    position: relative; 
    padding-bottom: 2em; 
margin-left: 100px; 
margin-top: 150px; 
} 


#box { 
cursor: pointer; 

background-color: #24272a; 
border-top-left-radius: 3px; 
border-top-right-radius: 3px; 
border-bottom-right-radius:10px; 
border-bottom-left-radius:10px; 
box-shadow: 0px 0px 3px 1px #4f575e; 
width: 225px; 
margin-top: 20px; 
padding: 10px; 
word-wrap: break-word; 
} 

JSFiddle here.