[CSS] flexboxfroggy

문제

flexboxfroggy.com 사이트 문제를 풀어보면서 flexbox에 대한 이해를 증진시켜보자.

---

코드

1. 

justify-content: flex-end;

2. 

justify-content: center;

3.

justify-content: space-around;

4. 

justify-content: space-between;

5. 

align-items: flex-end;

6. 

justify-content: center;

align-items: center;

7. 

justify-content:space-around;

align-items:flex-end;

8. 

flex-direction:row-reverse;

9. 

flex-direction: column;

10. 

flex-direction: row-reverse;

justify-content: flex-end;

11. 

flex-direction: column;

justify-content: flex-end;

12. 

flex-direction: column-reverse;

justify-content: space-between;

13. 

flex-direction: row-reverse;

justify-content: center;

align-items: flex-end;

14. 

order:2;

15. 

order:-4;

16. 

align-self: flex-end;

17. 

order:4;

align-self: flex-end;

18. 

flex-wrap: wrap;

19. 

flex-wrap: wrap;

flex-direction: column;

20. 

flex-flow: column wrap;

21. 

align-content:flex-start;

22. 

align-content:flex-end;

23. 

flex-direction: column-reverse;

align-content: center;

24. 

flex-flow:column-reverse wrap-reverse;

justify-content:center;

align-content:space-between;

---

결과