blah blah blah blah blah blah blah blah blah blah blah blah
one two
one two

In this test case a gray container wraps 3 divs: a green, an orange and a blue one.

  1. The container has float:left and width:auto, so it should shrink-wrap its contents. The same results occur with position:absolute, ...
  2. The green child is the one with more content, this should "define" the width of the container.
  3. The orange child has hasLayout (given by an assigned height.)
  4. The blue child has the same content as the orange one, but does not have hasLayout.

In IE/Win 6- the presence of the hasLayout orange child prevents the shrink-wrapping effect on the container. In IE7 this has been corrected, but now the orange box incorrectly shrink wraps its content (i.e. it doesn't have the same width as its siblings.)