Flex Element

.flex_element {
    /* <number> values */
    flex-grow: 3;
    flex-grow: 0.6;

    /* Global values */
    flex-grow: inherit;
    flex-grow: initial;
    flex-grow: revert;
    flex-grow: revert-layer;
    flex-grow: unset;
}

.flex_element {
    /* <number> values */
    flex-shrink: 2;
    flex-shrink: 0.6;

    /* Global values */
    flex-shrink: inherit;
    flex-shrink: initial;
    flex-shrink: revert;
    flex-shrink: revert-layer;
    flex-shrink: unset;
}

.flex_element {
    /* Specify <'width'> */
    flex-basis: 10em;
    flex-basis: 3px;
    flex-basis: 50%;
    flex-basis: auto;

    /* Intrinsic sizing keywords */
    flex-basis: max-content;
    flex-basis: min-content;
    flex-basis: fit-content;

    /* Automatically size based on the flex item's content */
    flex-basis: content;

    /* Global values */
    flex-basis: inherit;
    flex-basis: initial;
    flex-basis: revert;
    flex-basis: revert-layer;
    flex-basis: unset;
}

.flex_element {
    /* Keyword values */
    flex: auto;
    flex: initial;
    flex: none;

    /* One value, unitless number: flex-grow
    flex-basis is then equal to 0. */
    flex: 2;

    /* One value, width/height: flex-basis */
    flex: 10em;
    flex: 30%;
    flex: min-content;

    /* Two values: flex-grow | flex-basis */
    flex: 1 30px;

    /* Two values: flex-grow | flex-shrink */
    flex: 2 2;

    /* Three values: flex-grow | flex-shrink | flex-basis */
    flex: 2 2 10%;

    /* Global values */
    flex: inherit;
    flex: initial;
    flex: revert;
    flex: revert-layer;
    flex: unset;
}

.flex_element {
    /* <integer> values */
    order: 5;
    order: -5;

    /* Global values */
    order: inherit;
    order: initial;
    order: revert;
    order: revert-layer;
    order: unset;
}

.flex_element {
    /* Keyword values */
    align-self: auto;
    align-self: normal;

    /* Positional alignment */
    /* align-self does not take left and right values */
    align-self: center; /* Put the item around the center */
    align-self: start; /* Put the item at the start */
    align-self: end; /* Put the item at the end */
    align-self: self-start; /* Align the item flush at the start */
    align-self: self-end; /* Align the item flush at the end */
    align-self: flex-start; /* Put the flex item at the start */
    align-self: flex-end; /* Put the flex item at the end */

    /* Baseline alignment */
    align-self: baseline;
    align-self: first baseline;
    align-self: last baseline;
    align-self: stretch; /* Stretch 'auto'-sized items to fit the container */

    /* Overflow alignment */
    align-self: safe center;
    align-self: unsafe center;

    /* Global values */
    align-self: inherit;
    align-self: initial;
    align-self: revert;
    align-self: revert-layer;
    align-self: unset;
}