Skip to content

fix(layout): grow non-fr minmax tracks and resolve negative row lines - #63

Merged
tannevaled merged 1 commit into
mainfrom
fix/grid-track-maximize-and-row-span-full-v2
Aug 31, 2026
Merged

tannevaled merged 1 commit into
mainfrom
fix/grid-track-maximize-and-row-span-full-v2

Conversation

@tannevaled

Copy link
Copy Markdown
Contributor

Summary

  • CSS Grid's "Maximize Tracks" step now applies to any non-flexible track with room below its max cap (e.g. minmax(0,1536px)), not just fr tracks — previously such a track never grew past its base size.
  • grid-row (and grid-column) negative end lines (e.g. grid-row: 1 / -1, Tailwind's row-span-full) now resolve against the known explicit track count instead of an unresolved sentinel, which previously collapsed the span to zero rows and dropped its occupancy reservation.
  • Both bugs were found together on tailwindcss.com's own page-shell grid: the main content column was stuck at 40px (the decorative gutter track's width) instead of ~944px, roughly doubling the page's rendered height.

Test plan

  • go test ./layout/... — all pass, 100% statement coverage maintained (ratchet floor).
  • go test -short ./... — full suite green.
  • Verified live against https://tailwindcss.com/ with a temporary box-tree dump (not committed): content wrapper width 40px→944px, document height 22450px→12000px.

Two independent CSS Grid bugs, both root-caused live against
tailwindcss.com's own page-shell grid (grid-cols-1 md:grid-cols-[gutter
minmax(0,--breakpoint-2xl) gutter]):

1. distributeFr only grew tracks marked flexible (an fr unit). A track
   like minmax(0,1536px) has no fr unit but must still absorb leftover
   axis space up to its cap — the CSS Grid "Maximize Tracks" step, which
   applies to any track with room below its growth limit, not just fr
   ones. Without it such a track stayed at its 0px minimum forever, and
   tailwindcss.com's ~944px main content column collapsed to nothing.

2. placeItems always resolved grid-row lines against an unknown track
   count (-1), so a negative end line (grid-row:1/-1, i.e. Tailwind's
   row-span-full) always computed a zero-row span and reserved no
   occupancy. The explicit grid-template-rows count is already known
   before placement, so pass it through instead of the sentinel. Without
   the fix, an item meant to span every row (typically a decorative
   full-height background) let a later auto-placed item slide into its
   column, which is how tailwindcss.com's actual content wrapper ended
   up in the page's 40px decorative gutter track instead of its main
   column.

Together these cut the page's rendered height by roughly half. Verified
directly against the live site (a temporary box-tree dump, not
committed) before and after: the content wrapper went from 40px wide at
document height ~22450px to 944px wide at ~12000px.
@tannevaled
tannevaled merged commit fc85557 into main Aug 31, 2026
7 checks passed
@tannevaled
tannevaled deleted the fix/grid-track-maximize-and-row-span-full-v2 branch August 31, 2026 17:53
tannevaled added a commit that referenced this pull request Aug 31, 2026
Regenerates results.json/REPORT.md's table and montages against the merged
grid track-sizing fix (#63), the esbuild sandbox-escape fix (#65), and the
two perf dedupe wins (#64, #66). Records all four in FIDELITY.md's dated
log, closes the CSS Grid "Known gaps" bullet (now fixed), and adds an honest
note on tailwindcss.com's SSIM number after visually checking the montage.
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