Grid Auto Columns

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

Basic example

Use auto-cols-max to size each implicit column to its widest sibling’s max-content. The class is parsed and stored on StyleSpec.gridAutoColumns; see the parity omissions section for renderer caveats.

Style('grid auto-cols-max grid-flow-col', children: [
  Text('01'),
  Text('02'),
  Text('03'),
])

Class reference

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

Parity omissions

• The entire auto-cols-* family is parsed and stored on StyleSpec.gridAutoColumns (as GridAutoSize.auto_ / min / max / fr), but the Wrap-based grid renderer has no implicit-column sizing semantics. The class is accepted silently and produces no visual difference vs. omitting it. The demo above pairs auto-cols-max with an explicit grid-cols-3 so tiles fill the container width — without it, tiles would render at intrinsic content width.
• auto-cols-[<value>] (arbitrary numeric form) is not implemented — ArbitraryValueResolver has no auto-cols- registration.
• auto-cols-(<custom-property>) (CSS custom property form) — Flutter has no CSS-variable runtime, so this is permanently unsupported.