Skip to main content

Flex Grow

Atomic Props for controlling how flex items grow.

Atomic PropsCSS Properties
flexGrow={value}flex-grow: {value};

Grow

Use flexGrow={1} props to allow a flex item to grow to fill any available space.

Result
Normal
Grow
Normal
Live Editor

Don't grow

Use flexGrow={0} to prevent a flex item from growing.

Result
Grow
Not Grow
Grow
Live Editor