react-centpn

Simple react component to center children vertically.

Installation

yarn add react-centpn

Usage

import Center from 'react-centpn'

export default () =>
  <div {...{ style: { position: 'relative', height: '100%' } }}>
    <Center {...{ top: -20 }}>
      <div {...{ style: { height: 100 } }}></div>
    </Center>
  </div>

Props

top: number | string

Used as calc(50% - ${contentHeight / 2} + (props.top)).

props.top as number will be processed ${props.top}px.

License

MIT (http://opensource.org/licenses/MIT)