Grid Auto Rows

Use auto-rows utilities to control the size of rows that are implicitly created when an item is placed outside of the explicit grid.

Basic example

Use auto-rows-fr to size each implicit row to fill available space equally. The class is parsed and stored on StyleSpec.gridAutoRows; see the parity omissions section for renderer caveats.

Style('grid grid-cols-2 auto-rows-fr gap-4', children: [
  Text('01'),
  Text('02'),
  Text('03'),
  Text('04'),
])

Class reference

Class	Description
auto-rows-auto	Size implicit rows based on content.
auto-rows-min	Size implicit rows to their minimum content.
auto-rows-max	Size implicit rows to their maximum content.
auto-rows-fr	Size implicit rows to fill available space equally.

Parity omissions

• The entire auto-rows-* family is parsed and stored on StyleSpec.gridAutoRows (as GridAutoSize.auto_ / min / max / fr), but the Wrap-based grid renderer has no implicit-row sizing semantics. All four variants render identically to the equal-share fallback driven by tile heights (h-14) and parent height.
• auto-rows-[<value>] (arbitrary numeric form) is not implemented — ArbitraryValueResolver has no auto-rows- registration.
• auto-rows-(<custom-property>) (CSS custom property form) — Flutter has no CSS-variable runtime, so this is permanently unsupported.