Floated elements of variable height push siblings down

Question

I have 6 elements which should result in two rows of 3 elements each, so I\'ve floated them. But the content of the elements varies quite a bit, and the layout breaks when

Answer 1

You can use the :nth-child pseudo class to clear every fourth element.

figure:nth-child(4n){clear: left;}

EDIT:

4n doesn't quite cut it. 3n + 1 is what you want.

figure:nth-child(3n + 1){clear: left;}

http://jsfiddle.net/jMCng/1/