flex-grow - CSS 3

The flex-grow property specifies how much the item will grow relative to the rest of the flexible items inside the same container.Note: If the element is not a flexible item, the flex-grow property has no effect.

Syntax

flex-grow: number|initial|inherit;

Example

/* Safari 6.1+ */div:nth-of-type(1) {-webkit-flex-grow: 1;}
div:nth-of-type(2) {-webkit-flex-grow: 3;}
div:nth-of-type(3) {-webkit-flex-grow: 1;}/* Standard syntax */div:nth-of-type(1) {flex-grow: 1;}
div:nth-of-type(2) {flex-grow: 3;}
div:nth-of-type(3) {flex-grow: 1;}

Output / Return Value

Limitations

Alternatives / See Also

Reference