Does anyone understand css clearfix ?

Does anyone understand css clearfix ? All is fine in FF but in IE I get problems. I have a 2 column design and the right column will only stretch to the length of the left column and no further in IE. Obviously this causes problems if the right column has more content than the left because it cuts the content off. Well it doesn't cut it off it seems to force it under the footer.
Someone has suggested using the clearfix solution. I dont fully understand how the code works but I have done as suggested and seem to get no joy. I am wondering if I got the syntax right with this.



This in the css
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

This in the html
<div id="right-column" class="clearfix">