Challenge 1

First I sized the blocks through visual comparison, 130px width and height, 10px font. I then set the divs to inline-block, and floated the div1 to the left. I then created a container for divs 2 and 3 and floated them to the right to maintain the positions of div 2 and 3. I then set the top and left margin values of div 1 and section to negative values to properly shove them into the corners of the screen. last I adjusted the margin between divs 2 and 3 to find the right

Challenge 1

---

Challenge 2

I left the divs as block elements. div1 was already on the left, so I just used negative margins to shove it all the way into the corner div2 I used margin (0 auto) which sets the left and right margins to automatic, centering the div. div3 I set margin-left to auto, forcing the block right, then used a negative right margin to finish the job.

Challenge 2

---

Challenge 3

I created two divs, a 250px dark gray box and a nested 130px black box inside the first div. I positioned the parent div with a 25px top margin and an auto left right margin and set it's position to relative. I centered the child by setting it's position to absolute, offsetting it by 50% from top and left, and then using negative margins equal to half the width and height of the box to pull it into perfect alignment.

Challenge 3

---

Challenge 4

I created two divs, div 2 nested inside div 1, both 130px boxes. div1 is position: absolute, with negative margins to force it into the true corner, div2 is position:relative to div1 with a z index of 2 to float it above, and offset from top and left by percentage values.

Challenge 4

---

Challenge 5

I forked Challenge 2 and swapped the code for div1 and div3, since it's the same prompt but in the opposite direction

Challenge 5

---

Challenge 6

I set up a large gray div1 which contains small black div2 and div3. using position fixed I set div1 into the bottom right corner. using position absolute of div2 and div3 I can position them inside the fixed div1.

Challenge 6

---

Challenge 7

I nested the small div container in the large gray div, positioned the gray div with fixed position, and the black one inside it using absolute position.

Challenge 7

---

Challenge 8

same as challenge 7, except absolute postion top:0 instead of bottom:0

Challenge 8

---

Challenge 9

utilized the same technique as challenges 7 and 8, changed the dimensions of the large div to 400px tall, used position absolute and top,right offsets to move the two inner divs to their proper places.

Challenge 9

---

Challenge 10

used margin auto to center the large container, absolute position to position the inner containers, and pushed the large container down using another section above it.

Challenge 10

---

Challenge 11

nested a div in a div in a div, then used absolute position to shift around the inner divs.

Challenge 11

---

Challenge 12

used relative positioning and z-index to layer the divs according to comp.

Challenge 12

---

Challenge 13

I nested each tag inside the previous then set position to absolute and margin to half the div width;

Challenge 13

---

Challenge 14

I used margin-left: auto to send the large container to the right of the screen, then used absolute positioning to move the nested div.

Challenge 14

---

Challenge 15

I created a section that houses the four divs, then absolute positioning to move the divs to their correct position.

Challenge 15

---