<Inline />
The
Inline
component is a layout utility for aligning and spacing items horizontally.<Box padding={4} style={{textAlign: 'center'}}>
<Inline space={[3, 3, 4, 5]}>
<Card padding={1}>
<Text size={[2, 2, 3, 4]}>foo</Text>
</Card>
<Card padding={2}>
<Text size={[2, 2, 3, 4]}>bar</Text>
</Card>
<Card padding={3}>
<Text size={[2, 2, 3, 4]}>baz</Text>
</Card>
<Card padding={4}>
<Text size={[2, 2, 3, 4]}>baz</Text>
</Card>
<Card padding={5}>
<Text size={[2, 2, 3, 4]}>baz</Text>
</Card>
</Inline>
</Box>
as?: React.ElementType | keyof JSX.IntrinsicElements
space?: number | number[]
The spacing between the children.