Why doesn't the height of a container element increase if it contains floated elements?

Question

I would like to ask how height and float work. I have an outer div and an inner div that has content in it. Its height may vary depending on the content of the inner div but

Answer 1

You need to add overflow:auto to your parent div for it to encompass the inner floated div:

jsFiddle example