askdesign
9/16/2015 - 1:50 AM

clearing solutions

clearing solutions

/* There’s all kinds of float clearing solutions and hacks out there, 
but one pure and simple way to clear your floats is to simply use the 
overflow: hidden; declaration on the container of your floated elements. 
It doesn’t add a load of garbage to your stylesheet and it gets the job done 
in 90% of scenarios. */

.container {
	overflow: hidden;
}

/* For those float clearing situations where overflow: hidden; doesn’t work, 
the best alternative is the clearfix technique. Remember you don’t have to use 
the clearfix class name, your could target this code to any of your HTML elements 
individually. */

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