css - 容器 div 内的三个 div - 如何让高度自动？

Question

我有一个父级div，里面有三个div来创建一个列效果:

#container {
  height:230px;
  float:left;
}
#container_colone {
  float:left;
  width:40%;
  height:auto;
}
#container_coltwo {
  float:left;
  width:40%;
  height:auto;
}
#container_colthree {
  float:right;
  width:40%;
  height:auto;
}

这里是html

<div id="container">
  <div id="container_colone">
    col one here
  </div>
  <div id="container_coltwo">
    col two here
  </div>
  <div id="container_colthree">
    col three here
  </div>
</div>

因为我在容器中设置了高度，所以我希望这个容器中的所有列都具有相同的高度。因此，如果我将容器 div 设置为 400000000px，所有三个列将具有相同的高度。

上面的代码并没有削减它，我需要帮助来理解我需要做什么，这样我才能在未来快速获得它。

如有任何帮助，我们将不胜感激!

Answer 1

将 CSS 更改为:

    #container {
    height:230px;
    float:left;
    }
    #container_colone {
    float:left;
    width:30%;
    height:100%;
    }
    #container_coltwo {
    float:left;
    width:30%;
    height:100%;
    }
    #container_colthree {
    float:right;
    width:30%;
    height:100%;
    }