Grid

A CSS grid layout container for arranging children in rows and columns. Use Grid for card galleries, dashboards, and any multi-column layout. Use GridSpan to make a direct child span columns or rows.

Parameter	Description
columns	Number of fixed columns.
minColumnWidth	Minimum width for responsive columns.
maxColumns	Maximum responsive column count.
repeat	Responsive repeat mode: fill or fit.
gap	Space between grid items.
if	Conditional rendering expression.

Usage

xml
<Grid minColumnWidth="240" maxColumns="3" repeat="fit">
  <Card>First</Card>
  <Card>Second</Card>
</Grid>
<Grid columns="3">
  <GridSpan columns="2"><Card>Featured</Card></GridSpan>
  <Card>Standard</Card>
</Grid>

GridSpan

A CSS grid layout container for arranging children in rows and columns. Use Grid for card galleries, dashboards, and any multi-column layout. Use GridSpan to make a direct child span columns or rows.

Parameter	Description
columns	Number of columns.
rows	Number of rows.
if	Conditional rendering expression.

xml
<Grid minColumnWidth="240" maxColumns="3" repeat="fit">
  <Card>First</Card>
  <Card>Second</Card>
</Grid>
<Grid columns="3">
  <GridSpan columns="2"><Card>Featured</Card></GridSpan>
  <Card>Standard</Card>
</Grid>