How to use the .clearfix class?

Question

I think I\'m misunderstanding the concept of the .clearfix class. Maybe somebody can help me out.

I\'m looking for a way to use float and

Answer 1

• Clearfix is added around floating blocks
• Clear is added after floating blocks

Answer 2

The clearfix class is used on a container of which all the children are floating. If you would not use this, the container would not get any height (except in IE). http://complexspiral.com/publications/containing-floats/

What you are after is not a clearfix, but just a clear. You could make a class
.clear { clear: both;}
and apply that one instead of the clearfix you are using now.

If you want to learn more about clearfix, there is plenty of information out there:
What is a clearfix?

I have set up a small example to demonstrate the use of clearfix and clear: http://jsfiddle.net/hjXMG/1