Key Words & Phrases
-Parent element in which flex item are located in
-The child of a flex container (the parent).
What Are Flexible Box/Flex Box
Flexible Box/Flex Box is a box model optimized for interface design in CSS3. One of the major pros of flexible box/flex box is that floats are not used. Flexible Box/Flex Box is easy to use and powerful tool for distributing space and aligning contents. Using flexible bix/flex box box model flex containers are used this can be considered as the parent. The parent naturally has children; the children are termed as flex item. The flex items have numerous advantages some of these are:
-They can be laid out in any direction
-They can “flex” their size to fill unused or available space
-They can shrink to avoid overflowing the parent (flex container)
-Their style order can be rearranged at the style layer
Implementing the Flex Layout
Implementing the Flexible Box/Flex Box
Set the “display” property to -ms-flexbox (block-level ) or -ms-inline-flexbox (inline)
To set the orientation of the flex-items (children) set property “-ms-flex-direction” to either row or row-reverse or column or column-reverse or inherit.