get div height which has floated div inside

Question

I have a div with ID "containter" which contain 3 div with floated left property. When I use these floated div, the "container" div don't get height based on insided Div. What is the solution? Thank.

Answer 1

Put clear property to restore the flow. My Codepen

HTML

<div id="container">

  <div class="coucou" ></div>
  <div class="coucou" ></div>
  <div class="coucou" ></div>

  <div class="clear"></div>
</div>

CSS

#container{
  width : 600px;
  background:pink;

}

.coucou {
  margin-left:2px;
  width :100px; 
  height:200px;
  float: left;
  background:blue; 
}
.clear {clear:both;}