Thanks to the Flexbox Froggy exercise, I finally feel like I have a better grasp on flexbox. Although I took an HTML & CSS mini-course about 3 years ago, I have always felt a little fuzzy on the concept.

What is flexbox?

Flexbox refers to the flexible box layout system in CSS, and it is a particularly useful tool when styling elements in a 1-dimensional row such as component layouts.

Example of the CSS display flex property:

.container {
display: flex;
}

What new things did you learn?

During the exercise, I learned about the flex-flow CSS property which is a shorthand property that allows us to combine both the flex-direction and flex-wrap properties.

Example:

.container {
display: flex;
flex-flow: column-reverse wrap-reverse;}