Flexbox Froggy is a game to help teach different flexbox properties. The levels start out with basic flex layouts and progressively get harder as more concepts are added. This is a unique and interactive way to learn how to use flexbox in css, and it covers properties from justify-content to order and flex-wrap.
The CSS-tricks guide is a more comprehensive resource that includes the history of display: flex; in addition to all of the different properties available. There are also graphics to help demonstrate what each of the properties does. This guide is a very helpful reference when developing flexbox layouts.
As always, the Mozilla Developer Network provides an all-inclusive list of flexbox properties and information on how to get started with flex. The page goes into detail about the main and cross axes, start and and lines, as well as all of the other properties. Each property has its own page which goes more in depth on the specific property.
Understanding all of the different layout options with CSS flexbox can be tricky, but there are countless resources to help. From interactive games that teach flexbox to comprehensive documentation of the different properties, there is no shortage of information available.