JSFiddle - React, Tailwind, and code Playground

by Dustin Getz

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/react/0.14.3/react.min.js"></script>

<script src="https://rawgit.com/dustingetz/react-chatview/master/dist/react-chatview.js"></script>

<div id="root"/>

CSS

#header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 100px;
    background-color: #abcdef;
}
#footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100px;
    background-color: #abcdef;
}
#content {
    position: fixed;
    top: 100px;
    bottom: 100px;
    left: 0;
    right: 0;
    background-color: #F63;
    overflow: auto;
}

JavaScript

class App {
  render () {
    return <div>
      <div id="header"></div>
      <div id="content"></div>
      <div id="footer"></div>
    </div>;
  }
}


React.render(<App />, document.getElementById('root'));