Intent to Ship: Last Laseline Item Alignment

Skip to first unread message

Ian Kilpatrick

Oct 7, 2022, 3:15:05 PM10/7/22
to blink-dev

Contact emails





This feature allows developers to align items within either flex or grid layout by their last baseline, instead of their first. This is done via the following properties: align-items: last baseline; /* flex/grid container */ justify-items: last baseline; /* grid container */ align-self: last baseline; /* flex/grid item */ justify-self: last baseline; /* grid item */

Blink component


TAG review

None - I don't believe CSS Align 3 ever went through Tag Review. However I'm happy to file one and cc/ the specification editors.

TAG review status

Not applicable


Interoperability and Compatibility

Gecko: Shipped/Shipping (note - relatively basic support)

WebKit: Shipped/Shipping "It's complicated". WebKit currently parses "align-items: last baseline" however doesn't support it currently in layout (for Stable versions of the browser). This is currently changing however with recent commits by WebKit implementing the "last baseline" behaviour. E.g.

Web developers: No signals

Other signals:


This feature will likely be difficult to use initially for web developers for a few reasons. Support and implementation status is patchy. While adding tests for this feature... ...existing implementations typically only supported relatively simple cases well. This primarily was because various specifications which this feature interacts with didn't specify what the last baseline of various boxes should be. Additionally "@supports(align-items: last baseline)" will return true for many versions of browsers that don't have any (or partial) layout support for this feature. Web developers may rely on UA versions and/or javascript to check actual support.

WebView application risks

Does this intent deprecate or change behavior of existing APIs, such that it has potentially high risk for Android WebView-based applications?


Basic CSS property debugging in DevTools.

Will this feature be supported on all six Blink platforms (Windows, Mac, Linux, Chrome OS, Android, and Android WebView)?


Is this feature fully tested by web-platform-tests?


Flag name

--enable-experimental-web-platform-features or --enable-blink-features=CSSLastBaseline

Requires code in //chrome?


Tracking bug

Estimated milestones

108 or 109

Anticipated spec changes

We filed multiple issues related to this feature - primarily for all the different types of layout algorithms how to determine their last baseline was underspecified.

Scroll container -

Flexbox -

Multicol -

Tables -

Fieldset -

(and more).

All of these issues have been resolved, and added tests.

Link to entry on the Chrome Platform Status

Links to previous Intent discussions

Intent to prototype:


Oct 10, 2022, 7:37:52 PM10/10/22
to Ian Kilpatrick, blink-dev
Two other browsers already shipped this. No doubt to proceed this.

You received this message because you are subscribed to the Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to
To view this discussion on the web visit

Software Engineer, Google

Yoav Weiss

Oct 10, 2022, 11:02:10 PM10/10/22
to TAMURA, Kent, Ian Kilpatrick, blink-dev
This is not great.. Any ways in which we can improve the story? e.g. can we push for better WPT coverage? Have this feature be a part of Interop 23? Rename the feature into something that can be reliably detected? Something else? 

Ian Kilpatrick

Oct 11, 2022, 12:12:00 AM10/11/22
to Yoav Weiss, TAMURA, Kent, blink-dev
We'll likely be able to incorporate these tests into interop 2023 for both grid & flexbox which will hopefully improve interop. Renaming the feature isn't a great option (IMO) as it describes what it does well, and Firefox has already shipped support.


Mike Taylor

Oct 11, 2022, 10:22:50 AM10/11/22
to Ian Kilpatrick, Yoav Weiss, TAMURA, Kent, blink-dev

Quick question on the levels of support. You mention that Firefox has basic support. And WebKit landed some support in Do you have a sense of how Safari's implementation (maybe testable in nightly builds) compares to Firefox and your implementation?

Ian Kilpatrick

Oct 11, 2022, 1:30:36 PM10/11/22
to Mike Taylor, Yoav Weiss, TAMURA, Kent, blink-dev
The parts which begin connecting the above patch into flex/grid haven't reached a Safari TP which we can test yet. I expect initially it'll be similar to Firefox's level of support (handle basic cases well but complex interactions less well).


Philip Jägenstedt

Oct 12, 2022, 12:02:49 PM10/12/22
to Ian Kilpatrick, Mike Taylor, Yoav Weiss, TAMURA, Kent, blink-dev
The problem with feature detection here happens once in a while, and flex gap is a prominent previous example. But when it's already happened, there's really not much we can do to fix the situation. So I'm very much inclined to LGTM this.

But I see some tests are failing, are those failures accounted for, with bugs filed? If this is an area with messy interop, it might pay off to cross every t and dot every i here.

Ian Kilpatrick

Oct 12, 2022, 12:04:23 PM10/12/22
to Philip Jägenstedt, Mike Taylor, Yoav Weiss, TAMURA, Kent, blink-dev
The tests failing are due to the skew between a WPT sync, and WPT running against an "older" version of chrome.

These tests pass in Chrome Canary.


Mike Taylor

Oct 12, 2022, 2:02:23 PM10/12/22
to Ian Kilpatrick, Philip Jägenstedt, Yoav Weiss, TAMURA, Kent, blink-dev
Thanks - LGTM1.

Chris Harrelson

Oct 12, 2022, 2:03:42 PM10/12/22
to Mike Taylor, Ian Kilpatrick, Philip Jägenstedt, Yoav Weiss, TAMURA, Kent, blink-dev

Mike Taylor

Oct 12, 2022, 2:31:26 PM10/12/22
to Ian Kilpatrick, Philip Jägenstedt, Yoav Weiss, TAMURA, Kent, blink-dev, Chris Harrelson
(I can't count... tkent already gave LGTM1 - but you have 3 now)
Reply all
Reply to author
0 new messages