css：如何将左浮动div增长到100%

这是我想完成的一系列工作

红色div的高度应该扩大

我想要一个div，它可以扩展到其父级高度的100%。因为在运行时不知道大小

---

我做错了什么？

我认为如果您想将红色div扩展到父div的100%，则必须设置父div的高度：

<div style="float:left; height:120px;">
<div style="border: thin solid red;width:250px;height:100% "></div>
</div>

---

类似这样的东西…

好吧，我用一些奇特的css实现了它

---

如果可以/愿意，也可以使用jQuery

JS

---

谢谢你，但我不知道家长会有多大，所以我不能指定高度。你知道你的红色div至少应该有多高吗？在这种情况下，您可以将红色DIV包装在另一个DIV中，并将内部DIV设置为：min height:which px；

<div style="float:left; height:120px;">
<div style="border: thin solid red;width:250px;height:100% "></div>
</div>

div {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.container {
    position: relative;
}
.left {
    width: 400px;
    float: left;
    border: solid thin blue;
}
.right-wrapper {
    width: 20px;
    float: left;
}
.right {
    height: 100%;
    position: absolute;
    border: solid thin red;
}
.clear {
    clear: both;
    height: 0;
}
<div class="container">
    <div class="left">
        <div style="border: thin solid green;width:400px;height:50px"></div>
        <div style="border: thin solid green;width:400px;height:50px"></div>
        <div style="border: thin solid green;width:400px;height:50px"></div>
    </div>
  <div class="right-wrapper">
    <div class="right">test2</div>
  </div>
  <div class="clear">&nbsp;</div>
</div>

$('.rightdiv').css('height', $('.bigdiv').innerHeight());