To CenterY

Atomic Props to make children elements align to center vertical.

Atomic Props	Effect
toCenterY	Make children elements align to center vertical

Usage

Center vertical quickly with toCenterY prop:

Result

Loading...

Live Editor

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

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

Compose

toCenterY can compose with toLeft、toCenterX、toRight、toBetween、toEvenly、toAround:

Compose base on toCenterY

row

toCenterY toLeft

row

toCenterY toCenterX

row

toCenterY toRight

column

toCenterY toLeft

column

toCenterY toCenterX

column

toCenterY toRight

row

toCenterY toBetween

row

toCenterY toEvenly

row

toCenterY toAround