codepip’s Flexbox Froggy
A game for learning CSS flexbox

Solutions

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

align-items: center;
justify-content: center;

Level 7

align-items: flex-end;
justify-content: space-around;

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

align-self: flex-end;
order: 1;

Level 18

flex-wrap: wrap;

Level 19

flex-direction: column;
flex-wrap: wrap;

Level 20

flex-flow: column wrap;

Level 21

align-content: flex-start;

Level 22

align-content: flex-end;

Level 23

align-content: center;
flex-direction: column-reverse;

Level 24

align-content: space-between;
flex-flow: column-reverse wrap-reverse;
justify-content: center;