Skip to content

Grid Lanes: stacking-axis content distribution and self-alignment - #1275

Open
nicoburns wants to merge 2 commits into
devin/1791477864-grid-lanes-densefrom
devin/1791482811-grid-lanes-alignment
Open

nicoburns wants to merge 2 commits into
devin/1791477864-grid-lanes-densefrom
devin/1791482811-grid-lanes-alignment

Conversation

@nicoburns

Copy link
Copy Markdown
Member

Objective

Stacking-axis alignment for Grid Lanes (css-grid-3 §6.3 and §6.4), stacked on #1274. Baselines are out of scope: baseline alignment in the stacking axis falls back to start, which is what the spec does (§6.5).

  • Content distribution (§6.3): align-content/justify-content in the stacking axis moves the stacking range as a whole. center and the distributed values fall back to center/start per the spec, end packs to the end edge, normal/stretch behave as start, and safe clamps the free space at zero.
  • Self alignment (§6.4): an item adjacent to a gap (the last item in a track, or one followed by a spanning item) aligns within its margin box plus that gap. The gap is the free space after the item's margin box and gutter up to the next item in every spanned track, or the content box end for the last item. Items that are not last in all of their tracks have no alignment space, which is what Chromium does (GetAvailableAlignmentSpaceForItem). Dense-packed items take the space below them in the opening and cut the space of the item above.
  • normal self-alignment behaves as start in the stacking axis (Chrome 151 does not stretch auto-sized items by default); stretch stretches items without an explicit size into the gap.

All code is in the feature-gated lanes.rs; the shared grid code is untouched. 14 new Chrome 151 fixtures (56 tests) in test_fixtures/grid_lanes/ cover content distribution (center/end/safe/space-around), self-alignment (end/center/stretch/normal/align-self, with and without a stacking gutter), both directions, rtl and dense packing. All 204 lanes tests pass; the existing suites regenerate byte-identically.

Context

  • Placement records, per item, an alignment_space (LanePlacement) and, per track, the item placed last (last_in_track). Placing an item in a track closes the previous item's space in that track; after the container's stacking-axis size is known, the last items get the space up to the content box end. The item's stacking-axis area passed to align_and_position_item is its margin box plus that space, so the existing self-alignment code handles start/center/end/stretch.
  • For dense packing, Opening now carries the item placed before the skipped space (item_above), as Chromium's TrackOpening::alignment_candidate does, so backfilling adjusts both items' spaces.
  • Stacking-axis stretch/normal is overridden to start on the lanes GridItems: GridItem::known_dimensions would otherwise return the stretched size as the item's contribution during placement (the container's stacking-axis size is the percentage basis). Positioning re-reads the styles, so stretch still applies there.
  • Chrome 151 behaviour confirmed with the fixtures: the last item in a track aligns up to the container's content-box end; a spanning item that is no longer last in one of its tracks does not move.

Feedback wanted

  • Spec §6.4 says the last items' alignment container ends at the "lowest bottom outer edge" among last items when the container is indefinite; with a definite stacking-axis size Chrome uses the content box end, which is what this PR does in both cases (with an indefinite size the two coincide).

Link to Devin session: https://dioxus.staging.devinenterprise.com/sessions/93f06aa5dd4e4bc18d2482197dbb9191
Open in Devin Desktop: https://dioxus.staging.devinenterprise.com/desktop/session/93f06aa5dd4e4bc18d2482197dbb9191?variant=devin-insiders
Requested by: @nicoburns

@staging-devin-ai-integration

Copy link
Copy Markdown

I'll fix CI failures and address comments from users with write access that start with 'Devin'.

  • Disable automatic comment, CI, and merge conflict monitoring

@staging-devin-ai-integration
staging-devin-ai-integration Bot added this pull request to stack #1273 October 8, 2026 18:19
staging-devin-ai-integration Bot pushed a commit that referenced this pull request Oct 8, 2026
staging-devin-ai-integration Bot pushed a commit that referenced this pull request Oct 8, 2026
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from 5d5db4b to 7dd557a Compare October 8, 2026 18:40
staging-devin-ai-integration Bot pushed a commit that referenced this pull request Oct 8, 2026
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from 7dd557a to fba239c Compare October 8, 2026 20:39
staging-devin-ai-integration Bot pushed a commit that referenced this pull request Oct 8, 2026
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from fba239c to ae97122 Compare October 8, 2026 20:43
staging-devin-ai-integration Bot pushed a commit that referenced this pull request Oct 8, 2026
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from ae97122 to 907a292 Compare October 8, 2026 20:47
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch 2 times, most recently from a871400 to e5c1943 Compare October 8, 2026 21:59
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from e5c1943 to e84203d Compare October 8, 2026 22:46
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from e84203d to 31a6847 Compare October 8, 2026 22:56
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from 31a6847 to a8fe4f1 Compare October 8, 2026 23:09
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from a8fe4f1 to f70aeed Compare October 8, 2026 23:41
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from f70aeed to f5cb8c8 Compare October 9, 2026 00:01
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from f5cb8c8 to c63907a Compare October 9, 2026 01:04
@staging-devin-ai-integration
staging-devin-ai-integration Bot force-pushed the devin/1791482811-grid-lanes-alignment branch from c63907a to dad1597 Compare October 11, 2026 10:00

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant