To Around

Atomic Props to make children elements around.

Atomic Props	Effect
toAround	Make children elements evenly

Usage

Use toAround to make children elements evenly.

Result

Loading...

Live Editor

<Box toAround bgGray100 square-200> <Box square-60 bgOrange400 rounded-8></Box> <Box square-80 bgBlue400 rounded-8></Box> </Box>

<Box toAround bgGray100 square-200>
  <Box square-60 bgOrange400 rounded-8></Box>
  <Box square-80 bgBlue400 rounded-8></Box>
</Box>

Compose

toAround can compose with toTop、toCenterY、toBottom、ttoLeft、toCenterX、toRight:

Compose base on toAround

row

toAround toTop

row

toAround toCenterY

row

toAround toBottom

column

toAround toLeft

column

toAround toCenterX

column

toAround toRight