Simple react component to center content horizontally and vertically

Simple react component to center content horizontally and vertically

Simple react component to center content horizontally and vertically.

npm version Build Status Dependency Status devDependency Status Coverage Status MIT licensed

React Center

Simple react component to center content horizontally and vertically ###Install npm install --save react-center

Don't forget to manually install React^0.14 (peer dependency) if you're using [email protected] ###Use #####ES6

import React from 'react';
import ReactDOM from 'react-dom';
import Center from 'react-center';

ReactDOM.render(
  <Center>
    <div>1</div>
  </Center>,
  document.getElementById('app')
);

#####ES5

var Center = require('react-center');
...

#####Good old 1998 Script Tag: The component depends on React ^0.14 (a introduction of stateless components), so if you're using it without a build step, React ^0.14 must be present as a global.

<script src="https://npmcdn.com/[email protected]^0.14/dist/react.min.js"></script>
<script src="https://npmcdn.com/[email protected]^0.14/dist/react-dom.min.js"></script>
<script src="https://npmcdn.com/react-center"></script>

###API Check tests. ###Demo Navigate to the 'demo' folder and execute

npm install
npm run build
npm start

###Codepen example http://codepen.io/aush/pen/vLQYJY

Github Repository

Tags: #React #Layout