CSS flexbox – display flex and inline-flex
CSS property display can be used to define flex box container. It can have two values: display: flex; display: inline-flex; Syntax: Example – display:flex and read more
CSS flex – shorthand for flex-grow, flex-shrink and flex-basis
CSS flex is the shorthand property for flex-grow, flex-shrink and flex-basis. flex-shrink and flex-basis are optional. Its default value is 1 0 auto. Syntax: Example read more
CSS flex-basis
CSS flex-basis define the initial base size of the flex-item. Note that the final size of flex-item will depend upon flex-grow and flex-shrink values. Syntax: read more
CSS align-self – override align-items for flex-item
CSS align-self property can be used to override align-items value (defined at flexbox level) for a specific flex-item. Syntax: Example – align-self This example uses read more
CSS flex-shrink – shrink flex item if needed
CSS flex-shrink property lets a flex item to shrink if needed. Its initial value is 1. That mean by default flex items will shrink. It read more
CSS flex-grow – grow flex item if needed
CSS flex-grow property lets a flex item to grow if needed. Its initial value is 0. That mean by default flex item does not grow. read more
CSS order – flex items ordering
Flex items are, by default, displayed in the same order as they appear in the source document. The order property can be used to change read more
CSS align-content – packing multiple flex lines
The align-content property aligns a flex container’s lines within the flex container when there is extra space in the cross-axis. This property has no effect read more
CSS align-items – flexbox items vertical alignment
The align-items property can be used to align flex items in vertical diretion. It is flex container property. Syntax: align-items values flex-start flex-end center baseline read more
CSS justify-content – flexbox children aligment
The justify-content property aligns flex items along the main axis of the current line of the flex container. It is flex container property. Syntax: justify-content read more