CSS Layout Challenges

Challenge 1

I gave all of the div's a class of "box" and a class of 1 - 3, then I floated them all to the left. I put div's 2 and 3 inside a div container with the class "right" and floated that class to the right.

Challenge 2

I left box 1 alone, gave box 2 a margin of auto, and gave box 3 a float right.

Challenge 3

Box 1 is nested inside Box 2. I gave box 1 position: relative and box 2 position: absolute with a top and left offset of 100px because the containing box is 200px.

Challenge 4

Box 1 is nested inside Box 2. I gave box 1 position: relative and box 2 position: absolute with a top and left offset of 50%.

Challenge 5

Box 1 has float: right. Box 2 has clear: both to clear the float of the previous box, and has margin: auto to be centered. Box 3 was left alone.

Challenge 6

Body has position: relative so that Box 1 can be absolutely positioned at the bottom right of the screen. Box 1 also acts as a container for Box 2 and 3 which are absolutely positioned at the bottom-left and top-right of Box 1.