Flex Container

Flex containers are really useful, especially if you want your content to move according to a specific screen size. Flex containers can be broken down into six different properties. These include Flex-direction, flex-wrap, flex-flow, Justify-content, align-items, and align-content. You can have any of them incorporated into your website, but by default, flex-start will be present unless you change it.

Flex Grow/shrink Property

Flex-grow is an important aspect to web design style, specifically if you have a certain image or text that you need it to have a larger box than the rest of the content. Flex-shrink is just as important as flex-grow in terms of placement for specific content. For instance, if you need a section of text that is not very big, you can just use flex-shrink to keep the amount of space it uses to a minimum.

The Align-self Property

This aspect can be used in so many ways. For example, it can create more heirarchy in a layout and can also be used to create sub-text if you need it such as for a description. There are just so many possibilities worth looking into when creating your website.