JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.polymer-project.org/components/webcomponentsjs/webcomponents.js"></script> 
        
        <link rel="import" href="http://www.polymer-project.org/components/polymer/polymer.html"> 
        <link rel="import" href="http://www.polymer-project.org/components/core-toolbar/core-toolbar.html">
        <link rel="import" href="http://www.polymer-project.org/components/core-icon-button/core-icon-button.html">
        <link rel="import" href="http://www.polymer-project.org/components/paper-tabs/paper-tabs.html"> 
        <link rel="import" href="http://www.polymer-project.org/components/core-header-panel/core-header-panel.html">
  
 
    <body fullbleed unresolved vertical layout> 
        <core-header-panel > 
                <core-toolbar class="medium-tall">  
                    <div flex>I am Heading</div> 
                    <core-icon-button icon="search"></core-icon-button>

                    <paper-tabs class="bottom fit" selected="0">
                        <paper-tab>This Week</paper-tab>
                        <paper-tab>Next Week</paper-tab>
                        <paper-tab>History</paper-tab>
                    </paper-tabs> 
                </core-toolbar> 
            <div class="content">   
                 THIS <br />
              COMPONENT <br />
              IS NOT <br />
              VISIBLE <br />
                THIS <br />
              COMPONENT <br />
              IS NOT <br />
              VISIBLE <br />
                THIS <br />
              COMPONENT <br />
              IS NOT <br />
              VISIBLE <br />
                THIS <br />
              COMPONENT <br />
              IS NOT <br />
              VISIBLE <br />
 
                <footer layout vertical center>
                    <div  >I am footer</div>  
                </footer> 
            </div>
        </core-header-panel>   
    </body>

CSS

body {
    font-family: RobotoDraft, sans-serif;
    color: #333;
    padding: 10;
    padding-left:30px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-touch-callout: none;
} 
#core_toolbar,core-header-panel,core-toolbar {
    right: 0px;
    left: -10px;
    color: rgb(255, 255, 255);
    fill: rgb(255, 255, 255);
    top: 0px;
    position: absolute;
    background-color: rgb(79, 125, 201);
  }  
core-header-panel{left:0px; }
.content1 {
    margin-top: 55px;
    margin-bottom: 50px;
    height: auto;
} 
footer {
    position: fixed;
    background: red;
    width: 100%;
    padding: 15px;
    bottom: 0;
    left: 0;
    background-color: #ff4080;
    color:#FFFFFF;
}