JSFiddle - React, Tailwind, and code Playground

by jakie8

HTML

<div id="app">
    <div id="toolbar"></div>
    <div id="sidebar"></div>
    <div id="content"></div>
</div>

CSS

html{
    background:#efefef;
}

#app{
    width:940px;
    margin:70px auto 0;
    min-height:300px;
    background:#fff;
    position:relative;
}
#toolbar{
    background: #FFCFCF;
    height: 49px;
    position: relative;
    -o-border-top-left-radius: 4px;
    -moz-border-top-left-radius: 4px;
    -webkit-border-top-left-radius: 4px;
    border-top-left-radius: 4px;
    -o-border-top-right-radius: 4px;
    -moz-border-top-right-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    border-top-right-radius: 4px;
    box-shadow: inset 0 1px 0 #EA7575;
    background-image: -webkit-linear-gradient(#C60000, #970000);
    background-image: -moz-linear-gradient(#C60000, #970000);
    background-image: -o-linear-gradient(#C60000, #970000);
    background-image: -ms-linear-gradient(#C60000, #970000);
    background-image: linear-gradient(#C60000, #970000);
}
#sidebar{
    width:180px;
    position:absolute;
    top:50px;
    bottom:0;
    left:0;
    background:yellow;
}
#content{
    position:absolute;
    top:50px;
    left:180px;
    right:0;
    bottom:0;
    background:blue;
}