在另一个div中动态更改div的高度

Question

我试图让div的高度根据div中元素的数量动态变化。我想要做的整个想法显示在下面的图

中

最后一个div应该能够动态更改。似乎我必须设置第三个内部div的高度。如果我不这样做，则div出现在主div之外。

我尝试过的解决方案：

1）溢出：自动

2）尝试不设置第3个内部div的高度。

我必须使用javascript吗？我可以不使用JavaScript吗？这些解决方案不起作用。需要一些指导..如果问题重复，请抱歉....

Answer 1

不要将div设为固定高度，只需在CSS中使用float:left;。

Answer 2

嘿，现在我觉得你应该这个

<强> HTML

<div class="parent">
  <div class="child1">
    <div class="one">One</div>
     <div class="one">two</div>
  </div>

   <div class="child1">
    <div class="one">One</div>
     <div class="one">two</div>
  </div>


   <div class="child2">
     dynamic height
     </div>

</div>

<强>的CSS

.parent{
border:solid 1px red;
}
.child1, .child2{
overflow:hidden;
  margin:10px;
  border:solid 2px green;
}

.one{
background:red;
  border:solid 1px black;
  padding:10px;
  float:left;
  margin:10px;
}

现场演示 http://tinkerbin.com/i1R8emEb

现在根据您的设计改为高度宽度或高度。