First I created html tags for body, and 3 divs. (classes div1, div2, div3) Then in CSS, I created selectors for each tag, and added needed styles to mimic the comp. To do so, I utilized floats for the divs, and then in the body css selector, I set the margin and padding to 0 so there was no longer in space in between elements and the top of the page. I also added a small amount of margin in between the classes div2 and div3.
Same HTML set to Challenge 1. In CSS, added a position relative on the body selector, added a margin equal to 0 and auto on the div2 class so the element would center on the page, and a position absolute adding top and right px. In doing so, the elements are similar to the challange comp layout.
Same HTML as before, but removed the class element, div3. In CSS, first I added a left and right margin of 96 px for the body selector. I moved on and changed the background color of div1, changed the dimensions to 250X250, changed the absolute positioning to top 24px and left 193px. The di2 selector style stayed the same, but the asbolute position moved top 82px and left 250px.
Same HTML as Challenge 3. In CSS, reverted the body back to a margin and padding of 0. Then moved on to flip the colors of div1 and div2. div1