GridView
View Source
Lay out children in columns and rows. Wraps CSS grid styles in a simple API. To learn more about how you can use CSS grid visit learncssgrid.com.
Props
Accepts all valid HTML attributes.
'start' | 'end' | 'center' | 'stretch'Aligns content in a grid item along the column axis. Maps to CSS alignItems property.
anyRender custom component or HTML element tag. (Defaults to a <div> element).
stringThe size of implicit grid columns. Maps to CSS gridAutoColumns property.
'column' | 'row' | 'dense'The algorithm used to implicitly place grid items. Maps to CSS gridAutoFlow property.
stringThe size of implicit grid rows. Maps to CSS gridAutoRows property.
anyAny direct children can use the column|Start|End or row|Start|End shorthand properties to place themselves on the grid.
number | stringThe amount of space between columns. Maps to CSS gridColumnGap property.
Array | stringThe columns of the grid. Maps to CSS gridTemplateColumns property.
booleanIf true, sets display: inline-grid, otherwise it defaults to display: grid
anyGain access to the internal ref
objectDescribes props at different breakpoints. Read about mediaQueries.
number | stringThe amount of space between rows. Maps to CSS gridRowGap property.
Array | stringThe rows of the grid. Maps to CSS gridTemplateRows property.
objectDescribes styles at various points in time. Read about variants.