Flex ALign Items

Flexbox Align Items show same result as justifying content but here flex elements are aligned vertically. This property uses some values which helps to arrange elements in flex container.

• flex-start- this will arrange elements vertically at the top of flex container
• flex-end- this will arrange elements vertically at the bottom of flex container
• center- this will arrange elements vertically at the center of flex container
• baseline- this will arrange elements based upon their text align along horizontal line in flex container
• stretch- this will arrange elements vertically such that they get full vertical space of flex container

Flex Start

this will align items vertcally at the top of flex container.

Flex End

this will align items vertcally at the bottom of flex container.

Flexbox Code Generators

Try our Flexbox generators to practice and generate Flex code in real time.