IE7 Beta2 CSS sandbox, clearing floats, absolute positioning bug

Just a placeholder for some tests

Related articles:

Containing Floats

this is a box floated left: 
 #floatbox {
   float: left;
   width: 400px;
   background: #ffc;
 }

p: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas luctus quam a turpis. Mauris velit. Donec tincidunt venenatis orci. Nam tristique. Nullam quis arcu eget orci fringilla interdum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas lobortis neque sit amet lacus.

the left float here cannot be contained by using height, because if a percentage is used it will inherit a height from the body element, or width because of the borders. but it still needs a hasLayout trigger so this is given using the display:inline-block switch.

#floatwrap {
  border: 10px solid #f00;
  display: inline-block;
  overflow: auto;
 }

#floatwrap {display: block;}

Absolute Positioning error

#ap-test {
	width: 600px;
	border: 10px solid #f00;
	position: absolute;
	padding: 20px;
	}
#ap-test p, #ap-test div {background: #ffc;}
div: These block level elements are inside an an absolutely positioned div which has padding. They overflow the box by the amount of the left and right padding and borders. Blue rule on right is 60px wide.

p: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas luctus quam a turpis. Mauris velit. Donec tincidunt venenatis orci. Nam tristique. Nullam quis arcu eget orci fringilla interdum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas lobortis neque sit amet lacus.