Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save alishersadikov/e0c2a2e0c21fcd6df0d38369fa05a69a to your computer and use it in GitHub Desktop.
Save alishersadikov/e0c2a2e0c21fcd6df0d38369fa05a69a to your computer and use it in GitHub Desktop.
Turing 1611 CSS Challenges Warmups

Challenge 1

I had to change div1 display to inline-block, put the other two divs into a container and floated the whole container to the right.


Challenge 2

Set div2 margin to auto in order to center and gave absolute position to div3 with a right margin of 0.


Challenge 3

Placed the div2 inside of div1. Centered both divs margin auto and added top margin.


Challenge 4

Placed the div2 inside of div1 again. Added top and left margins to inner div position its left upper corner in the center of the first div.


Challenge 5

Set div1 position to absolute with a right margin of 0. Set div2 position to relative, margin auto, top 300px. Set div3 position to relative also, top 300px.


Challenge 6

Placed div2 and div3 inside of div1. Set div1 position to absolute with a right margin of 0. Set div2 position to absolute, with zero bottom and left margins. Floated div3 to the right;


Challenge 7

Placed div2 inside of div1. Set div1 position to fixed and div2 position to absolute, bottom 0 and right 0;


Challenge 8

Same as challenge 7 except for top 0.


Challenge 9

Placed div2 and div3 inside of div1. Set div1 position to fixed and div2/div3 positions to absolute, with top/bottom 0 and left 100px.


Challenge 10

Placed div2 and div3 inside of div1. Set div1 position to fixed and div2/div3 positions to absolute, with left/right 50px and top 50px.


Challenge 11

Placed div3 inside div2 and div2 inside div1. Set div1 position to fixed, div2 position to absolute, right 0 and top 300px. Set div3 position to absolute, right 15px and bottom 15px.


Challenge 12

Set div1 position to fixed. Div2 position to relative, top 300px, left 175px. Div3 position to relative, top 200px, left 100px.


Challenge 13

Nothing special here. Set all div displays to inline-block. Starting from div2, moved each div by 100px from the top and left.


Challenge 14

Set outer div position to fixed and inner div position to absolute, left 0 and bottom 0.


Challenge 15

This one was a little challenging. I had to put all four divs inside a container. Set container position to fixed. Set div1 display to inline-block. Set all div positions to absolute and manually adjusted across the container.

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