tests: hasLayout block adjecant to floated block, by using min-width (IE 7) and ‘zoom’ (IE 6).

see also a test file with left–floated block.

Relevant styles

.testgrid {min-width:100px}
.testgrid::after {content:"[.]"; display:block; clear:both; visibility:hidden; height:0;}

.testgrid p {margin:10px; background:#6c8}

.testgrid p.x1 {float:left; width: 100px; height:100px; background:url(bg.gif) repeat 10px 10px; border:2px solid #000;}
p.x2 {min-width:100px;}
p.x3 {max-width:600px;}
p.x4 {width:80%;}

Notes

• IE 6: hasLayout for .testgrid and p.x* (zoom:1) in a cc
• IE 7: hasLayout for .testgrid and p.x2 (top box) (min-width:100px)
• IE 7: hasLayout for .testgrid and p.x3 (second box) (max-width:600px)
• float should be contained in the .testgrid
• Decent browsers #testgrid::after

Last modified: May 13 2006 07:07:11 GMT.

• A [ La Chatte Noire ] development area
• [ contact ]
• [ sectionindex ]
• [ Empty Spaces ]