Skip to main content

Flex Shorthand

Utility classes for setting the flex shorthand property.

Usage​

Particle defines enums from 0 to 3, which set flex-grow with default values for flex-shrink, and flex-basis.

flex--0​

Equivalent to flex: 0, which is shorthand for:

{
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: 0;
}

flex--1​

Equivalent to flex: 1, which is shorthand for:

{
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0;
}

flex--2​

Equivalent to flex: 2, which is shorthand for:

{
  flex-grow: 2;
  flex-shrink: 1;
  flex-basis: 0;
}

flex--3​

Equivalent to flex: 3, which is shorthand for:

{
  flex-grow: 3;
  flex-shrink: 1;
  flex-basis: 0;
}