Skip to content

Instantly share code, notes, and snippets.

@Adamj1232
Created February 1, 2017 16:18
Show Gist options
  • Save Adamj1232/01e8e3b010824867d4a595435478ca92 to your computer and use it in GitHub Desktop.
Save Adamj1232/01e8e3b010824867d4a595435478ca92 to your computer and use it in GitHub Desktop.
#### My CSS Challenge 1
I chose 100x100px boxes to make squares equal. I set the margin size to 0 and the font-size to 10px in the body to bring boxes to the edge and add small text to the corners.
On Div3 I set position:absolute and right:0 to send that box far right. I set Div2 to position: absolute, right: 100px, margin-right: 5px; this moved Div2 just to the left of Div3 5px.
[CodePen-1] (http://codepen.io/Adamj1232/pen/wgpOVa)
#### My CSS Challenge 2
To slant boxes I left Div1 as is from challenge 1, changed Div2 to right: 50%, top: 100px; which places the Div in the middle of the work area and 100px down. Finally I set Div3 to
right:0px and top: 200px which moved it far right and down two box lengths giving it a slope from right to left.
[CodePen-2] (http://codepen.io/Adamj1232/pen/bgLWvM)
#### My CSS Challenge 3
[CodePen-3] (http://codepen.io/Adamj1232/pen/apExNj)
#### My CSS Challenge 4
[CodePen-4] (http://codepen.io/Adamj1232/pen/vgpPoM)
#### My CSS Challenge 5
[CodePen-5] (http://codepen.io/Adamj1232/pen/BpJEoo)
#### My CSS Challenge 6
[CodePen-6] ()
#### My CSS Challenge 7
[CodePen-7] (http://codepen.io/Adamj1232/pen/WRMpWZ)
#### My CSS Challenge 8
[CodePen-7] (http://codepen.io/Adamj1232/pen/zNWvpK)
#### My CSS Challenge 9
[CodePen-7] (http://codepen.io/Adamj1232/pen/zNRwxb)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment