When a div is floated it requires a width and height element for the background color to be effective or as you discovered a line break with clear both.
To clarify: when an element CONTAINS ONLY FLOATS, and you wish IT to not collapse) (background to be visible, push down other elements, etc; ) You must cleat he floats some how. Adding a block element with clear:both as the LAST item will accomplish this. HOWEVER there are far better methods that dont require unsemantic markup.
Delete the BR and try giving the containing element "overflow:hidden"
Hope that helps.