Hi, Whenever I create a div in which all the containing elements are floated, the containing <div> wants to collapse. I attempted to fix this problem by adding an empty div to the bottom of the containing div <div style="clear: both"></div> This worked fine in Firefox, but had bugginess in IE7. Then I tried: <div style ="clear: both; height: 1px;"></div> Again this worked fine in firefox. It also appears to work in IE7 until you scroll the div off the screen and then back on again. Once you scroll the div back on screen, the div is partially collapsed again to seemingly random heights: I can't set a static height for the div as the content changes. Any ideas how I can overcome this problem?
For those who may be interested, it appears that IE7 does not like empty <div>s used in this manner, so to solve the problem I added a 1x1px image the same color as the background like this: <div style="clear: both"><img src="wht1pximg.gif"></div> Still if anyone has a better solution, I would like to hear it.