Flexbox Bootcamp: Challenge 1

• Change the container to a flex container.
• Set the flex items to display in a row in reverse order.
• Place the row at the bottom of the container div.

Flexbox Bootcamp: Challenge 2

• Change the container to a flex container.
• Place the row of flex items at the center of the cross axis.

Flexbox Bootcamp: Challenge 3

• Change the container to a flex container.
• Set the flex items to display as a single column.
• Place the column at the center of the cross axis.

Flexbox Bootcamp: Challenge 4

• Change the container to a flex container.
• Set the flex items to wrap into several rows.

Note: Exactly where the divs wrap depends on the width of the blue div. You may have 9 divs per row, or more, or less. Resize your browser to see how the divs wrap.

Flexbox Bootcamp: Challenge 5

• Change the container to a flex container.
• Set the flex items to wrap into several rows.
• Align the top row to the top of the flex container and the bottom row to the bottom of the flex container.

Flexbox Bootcamp: Challenge 6

• Change the container to a flex container.
• Set the flex items to display as a column.
• Set the flex items to wrap into several columns.
• Distribute the columns evenly across the cross axis, allowing a left margin before the first column and a right margin after the last column.

Note: Exactly where the columns wrap depends on the height of blue div. You may have 3 divs per column, or more, or less. Adjust the height of your browser to see how the divs wrap.

Flexbox Bootcamp: Challenge 7

• Change the container to a flex container.
• Center the flex item along the main axis.
• Center the flex item along the cross axis.