Min Height

Use minH-{value} props to controll element min height.

Atomic Props	CSS Properties
minH-{value} / minH={value}	min-height: {value};

Usage

Result

Loading...

Live Editor

<Box toCenter white h-100 bgGray100> <Box minH-50 bgRed400 p2> minH-50 </Box> <Box minH-5rem bgYellow400 p2> minH-5rem </Box> <Box minH={50} bgGreen400 p2> minH={'{50}'} </Box> <Box minH="100px" bgBlue400 p2> minH="100px" </Box> <Box minH="80%" bgPurple400 p2> minH="80%" </Box> </Box>

<Box toCenter white h-100 bgGray100>
  <Box minH-50 bgRed400 p2>
    minH-50
  </Box>
  <Box minH-5rem bgYellow400 p2>
    minH-5rem
  </Box>
  <Box minH={50} bgGreen400 p2>
    minH={'{50}'}
  </Box>
  <Box minH="100px" bgBlue400 p2>
    minH="100px"
  </Box>
  <Box minH="80%" bgPurple400 p2>
    minH="80%"
  </Box>
</Box>