View Full Version : Crazy problem. By removing CSS float the JS doesn't work.

10-06-2012, 10:03 PM
The title is wrong and I can't edit it: It should read: "By ADDING CSS float":

This should return the height of the content:


...but it doesn't work. If I remove the float:left from the boxes then it works:

http://page-test.co.uk/no-float.html (this works)

The only difference in the two is that the boxes in the working one do not have float:left.

Why? This is crazy. What can do I do about it?

Thanks for looking at my examples.

10-06-2012, 11:48 PM
A parent element that contains only floated elements collapses (http://css-tricks.com/all-about-floats/) such that its height is 0. The provided link discusses ways to clear floats.

Adding overflow:auto to the parent element often works to fix this.

rnd me
10-07-2012, 07:18 PM
if the tag around the float:left boxes is changed to float:left, its height comes back.