estudos CSS: float vs overflow

dabblet.css

.container { 
	background: #CCC;
	box-model: box-sizing;
}

#container-float {
	float: left;
}

#container-overflow {
	overflow: hidden;
}

#first { 
	background: red;
	min-height: 100px;
}

#last { 
	background: yellow;
	min-height: 250px; 
}

.box { 
	float: left;
	width: 200px
}

dabblet.html

<div class="container" id="container-overflow">
  <h1>container-overflow</h1>
  <div class="box" id="first">lorem ipsum</div>
  <div class="box" id="last">another</div>
</div>
<br>
<div class="container" id="container-float">
	<h1>container-float</h1>
  <div class="box" id="first">lorem ipsum</div>
  <div class="box" id="last">another</div>
</div>

<div style="clear:both;">
lorem
</div>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}