Make flexbox and flex items obey the positional alignment keywords from https://drafts.csswg.org/css-align-3/#positional-values. Flexbox previously only obeyed center, flex-start, and flex-end. The additional alignment keywords (start, end, self-start, self-end, left, right) allow authors to more easily align the flex items in the face of varying writing modes and flex flows.

Motivation

Without these additional keywords, developers need to change the keyword values whenever they change the writing mode, text direction, or flex reversal properties (flex-direction: row/column-reverse or align-content: wrap-reverse). The keywords implemented here let them set alignment once.

Specification

Specification link


Unknown standards status - check spec link for status

Status in Chromium

Blink>Layout>Flexbox


Enabled by default (tracking bug)

Consensus & Standardization

After a feature ships in Chrome, the values listed here are not guaranteed to be up to date.

Owner

Last updated on 2021-12-13