Clearfix is a technique to deal floated blocks in a container so that blocks below the container to not sneak up into the empty space. Commonly used in layout with columns and footer, where the footer will not move pass the last float. An inline method is to insert an empty div <div style=“clear:both”></div> below the last block and before the footer. This can be handled with a class such as below where .clearfix is added to the html element of the last floated block.

 /* *** Float containers fix: *** */ 
.clearfix:after {
     content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
.clearfix{display: inline-block;}