JSFiddle - React, Tailwind, and code Playground

by hamix

HTML

<body>
    <div class='content-wrapper' id='container'>
        <header>
            <div class="content-wrapper">
                <div class="float-left">
                    <p class="site-title"><img src="http://lorempixel.com/150/145/" /></p>
                </div>
                </div>
                <nav>
                </nav>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div><div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div><div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>
            <div class='divBlock'>some text...</div>

CSS

.content-wrapper {
    margin: 0 auto;
    max-width: 800px;
    position: relative;
    background-color: #cccccc;
}

nav {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height:43px;
    padding:0px 10px 0px 10px;
    /* Rounded Corners */
    /*border-radius: 10px; */

    /* Background color and gradients */
    background: #014464;
    background: -moz-linear-gradient(top, #0272a7, #013953);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0272a7), to(#013953));

    /* Borders */
    border: 1px solid #002232;
  
    box-shadow:inset 0px 0px 1px #edf9ff;
}

div.divBlock {
    margin: 20px 0;
}
}