Jim Neath

Manchester based Ruby on Rails & Facebook App Developer

Self Clearing Floats in CSS

This is a quickie mainly to remind myself. My friend and fellow Fudge developer, Mike ”1312” Byrne showed me a CSS trick to have divs clear themselves.

div#container 
{
  height: 1%;
}

div#container:after 
{
content: "."; 
display: block; 
height: 0; 
clear: both;
visibility: hidden;
}

Brilliant. This works in Safari, Firefox and IE6+ as far as I know.

Tagged with

blog comments powered by Disqus

I am available for freelance work! Click here to email me.

Jim Neath is a Freelance Ruby on Rails & Facebook app developer from Manchester, UK, currently working for Engine Yard.