A New CSS Clear Floats Hack

This clearfix hack is good to clearing floats without having to adding additional html tag. floating is quite a common technique to make a tableless layout, and it's really annoying how many times you have to create a div with clear float class in it. This hack will solve that problem, instead of creating a new div, you attach this class to the parent class. It works flawlessly.


This new clearfloat hack remove IE for Mac support, thus reduce the size of the code.

/* new clearfix */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

Share the love

Leave a Comment

Please keep in mind that comments are moderated and rel="nofollow" is in use. You can use [code][/code] if you want to write codes. Don't spam us :) Thanks!