html div going behind img

Im trying to make this layout (many of these are in a list):

An image (of varying height, but a set width) on the left. To the right is an <h2>, and below that, b开发者_高级运维ut still to the right of the image is a div with other content in it.

The div is used to provide a different colored background. Right now, the div for some reason extends behind the image, and the images has a varying distance between them, and sometimes one element will get pushed to the right by the height of the image above.

http://jsfiddle.net/RQsUc/

Add overflow: hidden to your outermost divs (div (display: block)) to contain the floats.