Flexbox Froggy Play

preview_player
Показать описание
Level 1:
justify-content: flex-end;
Level 2:
justify-content: center;
Level 3:
justify-content: space-around;
Level 4:
justify-content: space-between;
Level 5:
align-items: flex-end;
Level 6:
justify-content: center;
align-items: center;
Level 7:
justify-content: space-around;
align-items: flex-end;
Level 8:
flex-direction: row-reverse;
Level 9:
flex-direction: column;
Level 10:
flex-direction: row-reverse;
justify-content: flex-end;
Level 11:
flex-direction: column;
justify-content: flex-end;
Level 12:
flex-direction: column-reverse;
justify-content: space-between;
Level 13:
flex-direction: row-reverse;
justify-content: center;
align-items: flex-end;
Level 14:
order: 1
Level 15:
order: -1;
Level 16:
align-self: flex-end;
Level 17:
order: 1;
align-self: flex-end;
Level 18:
flex-wrap: wrap;
Level 19:
flex-wrap: wrap;
flex-direction: column;
Level 20:
flex-flow: column wrap;
Level 21:
align-content: flex-start;
Level 22:
align-content: flex-end;
Level 23:
flex-direction: column-reverse;
align-content: center;
Level 24:
flex-wrap: wrap-reverse;
flex-direction: column-reverse;
justify-content: center;
align-content: space-between;

Playing through Flexbox Froggy to learn basic Flexbox!

Рекомендации по теме
Комментарии
Автор

Right, the 24th was tricky:) Wrap-reverse..

cismuz
Автор

I got stuck on 20. I wouldn't have known that you combine the commands in addition to the properties. Didn't seem intuitive. Instead, I was typing "flex-flow: column; flex-flow: wrap but to no avail. I feel stupid now (as always)

Ben-grzy