/* clearfix can be applied to any parent container that you wish to have
 * floated elements inside without losing the container's vertical height */

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.clearfix {
  display: inline-block;
}

html[xmlns] .clearfix {
  display: block;
}

html .clearfix {
  height: 1%;
}