Grid

Grid is a layout for managing grid layouts

Source

@chakra-ui/layout

Props#

Grid Props#

Grid composes Box so you can pass all the Box prop, and these shorthand prop to save you some time:

`autoColumns`

Description

Shorthand prop for gridAutoColumns

Type

SystemProps["gridAutoColumns"]

`autoFlow`

Description

Shorthand prop for gridAutoFlow

Type

SystemProps["gridAutoFlow"]

`autoRows`

Description

Shorthand prop for gridAutoRows

Type

SystemProps["gridAutoRows"]

`column`

Description

Shorthand prop for gridColumn

Type

SystemProps["gridColumn"]

`row`

Description

Shorthand prop for gridRow

Type

SystemProps["gridRow"]

`templateAreas`

Description

Shorthand prop for gridTemplateAreas

Type

SystemProps["gridTemplateAreas"]

`templateColumns`

Description

Shorthand prop for gridTemplateColumns

Type

SystemProps["gridTemplateColumns"]

`templateRows`

Description

Shorthand prop for gridTemplateRows

Type

SystemProps["gridTemplateRows"]

GridItem Props#

`area`

Description

Shorthand prop for gridArea

Type

SystemProps["gridArea"]