<!DOCTYPE html>
<html>
<head>
<style> 
.clearfix{border: 5px solid #FFB2F5; background-color: yellow; zoom: 1; /* ie 6,7 */}

.clearfix:before, .clearfix:after{content: " "; display: table;}
.clearfix:after{clear: both;}
.one{float:left; width:50%; height:150px; border: 5px solid purple;box-sizing: border-box;} 
  
</style>
</head>
<body>

<div class="clearfix">
<div class="one">자식 div </div> 
<div class="one">자식 div </div> 
</div>

</body>
</html>