Awesome

react-styled-box

What is it ?

This is a simple styled.div component, that makes your basic positioning of elements faster. Instead of writing all of the "styled" components upfront you can prototype the layout faster with this ready <Box>.

How it works ?

import Box from 'react-styled-box';

<Box flexDirection="column">
  <Box flexDirection="row">
    <span> header </span>
    <span> header 2 </span>
  </Box>

  <Box flexGrow={1}>
    <Box margin={10} padding="10px 0 0 0">
      Item one
    </Box>
    <Box margin={10} padding="10px 0 0 0">
      Item two
    </Box>
  </Box>
</Box>

What does it support ?

Check A Complete Guide to FlexBox