Skip to content

Instantly share code, notes, and snippets.

@marissa27
Last active December 7, 2016 17:03
Show Gist options
  • Save marissa27/dde0ad463ae258444f3e5b02b8563e38 to your computer and use it in GitHub Desktop.
Save marissa27/dde0ad463ae258444f3e5b02b8563e38 to your computer and use it in GitHub Desktop.
Turing 1611 CSS Challenges Warmups
Challenge Number 1

My approach was putting my divs into one section. Then within that element placing the two divs that needed to be placed out to the right in their own div that I could float out. By making all the boxes an in-line element I could allow everything to fall onto one line. Challenge number 1

Challenge Number 2

My approach was putting my divs into their own section. With div1 it would automatically sit to the right so I had to focus on div2 and div3. For div3 I did a float right and it shot to where I needed it to. Div2 I thought a text-align center would work on the section, but that just centered the word div2. I then reiterated the width of the div and did a margin: 0 auto to center it. Challenge number 2

Challenge Number 3

My approach was making a div that had another one nested inside of it. I gave each div its own class. I centered the parent div with margin: 0 auto; Then I tried padding to hold the other div in the center, but that messed up the div1 paragraph so I centered the second div with the margin 0 auto and gave it a margin top to get it centered. Challenge number 3

Challenge Number 4

Have two different divs and have the second one become absolute so it goes to the z-plane then use margins to move it down and to the right. Challenge number 4

Challenge Number 5

Have them all contained in one section. Float out the div1 and then position relative then have the top be the same height as the div boxes then do margin 0 auto for div 2 and leave div 3 where it is.
Challenge number 5

Challenge Number 6

*placeholder Challenge number 6

Challenge Number 7

*placeholder Challenge number 7

Challenge Number 8

*placeholder Challenge number 8

Challenge Number 9

*placeholder Challenge number 9

Challenge Number 10

*placeholder Challenge number 10

Challenge Number 11

*placeholder Challenge number 11

Challenge Number 12

*placeholder Challenge number 12

Challenge Number 13

*placeholder Challenge number 13

Challenge Number 14

*placeholder Challenge number 14

Challenge Number 15

*placeholder Challenge number 15

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment