Grid component
A <Grid> can be used to place elements in columns on your page. It's common to use <Grid> with either <Card> or <Box> components.
The component is responsive, which means the columns will collapse on smaller screens automatically.
1
2
3
4
Attributes
The <Grid> component can be customized using the following attributes.
Columns
You can set the number of columns with the cols attribute. Must be 1,2,3 or 4. Defaults to 1.
1
2
3
4
Gap
You can increase the gap between the grid items with the gap attribute. It must be a value between 0 and 5 inclusive.
1
2
3
4