javascript - 根据内部元素动态更改 CSS

Question

看看我的代码 http://jsfiddle.net/rkumarnirmal/GXAYa/6/

#box_bg是外灰盒，#box是内黑盒。我在#box. 我需要的是#box_bg根据内部的大小动态放大或减小它的高度#box。

有人可以帮我吗？

谢谢！

Answer 1

不要指定绝对高度：只需使用height:auto. #box对于框架的静态位置和一些填充，#box_bg将自动调整其内容的大小。

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

Answer 2

更改height:260px;为height:auto;。

UPD：添加position:relative到#box

Answer 3

我不确定你为什么需要这个职位：绝对，所以试试这个作为一个选项，看看它是否能解决你的问题：

#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 在这里。