<Box />
The
Box component is a basic layout wrapper component which provides utility properties for flex, margins and padding.column?: 'auto' | 'full' | number | Array<'auto' | 'full' | number>columnStart?: 'auto' | number | Array<'auto' | number>columnEnd?: 'auto' | number | Array<'auto' | number>display?: 'none' | 'block' | 'grid' | 'flex' | 'inline-block' | Array<'none' | 'block' | 'grid' | 'flex' | 'inline-block'>flex?: number | number[]Sets the
flex CSS attribute. The property is responsive.height?: 'stretch' | 'fill' | Array<'stretch' | 'fill'>margin?: number | number[]Applies margins to all sides. The property is responsive.
marginX?: number | number[]Applies margins to the left and right sides. The property is responsive.
marginY?: number | number[]Applies margins to the top and bottom sides. The property is responsive.
marginTop?: number | number[]marginRight?: number | number[]marginBottom?: number | number[]marginLeft?: number | number[]overflow?: 'visible' | 'hidden' | 'auto' | Array<'visible' | 'hidden' | 'auto'>padding?: number | number[]paddingX?: number | number[]paddingY?: number | number[]paddingTop?: number | number[]paddingRight?: number | number[]paddingBottom?: number | number[]paddingLeft?: number | number[]row?: 'auto' | 'full' | number | Array<'auto' | 'full' | number>rowStart?: 'auto' | number | Array<'auto' | number>rowEnd?: 'auto' | number | Array<'auto' | number>sizing?: 'content' | 'border'