<!DOCTYPE html>
<style>
#container {
width: 400px;
}
.square {
width: 100px;
height: 100px;
background-color: blue;
}
#float {
float: left;
}
#bfc {
margin-left: 30%;
overflow: hidden;
}
</style>
<p>You should see two blue squares below.</p>
<div id="container">
<div id="float" class="square"></div>
<div id="bfc" class="square"></div>
</div>