That damn clearFix…

I’ve used this solution to clear float containers in CSS:

/* float clearing for IE6 */
* html .clearfix{
  height: 1%;
  overflow: visible;
}
 
/* float clearing for IE7 */
*+html .clearfix{
  min-height: 1%;
}
 
/* float clearing for everyone else */
.clearfix:after{
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
  font-size: 0;
}

But it seems you can just do this as well:

#container-to-fix { overflow: hidden; }

Now I’ve read a bit about how this isn’t always the most ideal solution, but simply setting overflow to “hidden” has definitely been working out for me lately…

Category: CSS

1 Comment »

  1. Actually, I’m starting to see this doesn’t always work – but it is worth trying first.

    Comment by rbosinger — January 23, 2010 @ 3:26 pm

Leave a comment