JSFiddle - React, Tailwind, and code Playground

by LyndseyB

HTML

<div class="top-green"></div>
<div class="container container-pad logo">
    <h1 class="green"> Homestyling </h1>       
</div>

<div class="container container-pad top-padding">
    Hello!
</div>

CSS

/* --------------
 ----- RESET ----- 
----------------- */
html,body,div,span,p,ol,ul,li,table,th,tr,td,h1,h2,h3,h4,h5,h6,figure {
    margin:0;
    padding:0;   
}

/* box sizing */
* {
    -webkit-box-sizing: border-box; /* Safari/Chrome */
	-moz-box-sizing: border-box;    /* Firefox */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

/* Html5 Support for <IE9 */
article, aside, details, figcaption, figure, footer, header, menu, nav, section { 
	display: block; 
}

/* lists */
ol,ul { 
    list-style:none;
}

/* tables */
table { 
    border-collapse: collapse; 
    border-spacing: 0;    
}

th, td { text-align:left; }

/* borders */
table, fieldset, legend, img, hr { 
    border:0; 
}

/* horizontal rules */
hr {
    height:1px;   
    background:#eee;
    text-align: center; /* for glyphs */    
}

a:active, a:hover, :focus { outline: 0; }

/* ----------------
 --- BASE STYLES --- 
------------------- */

/* typography */
html { font-family: sans-serif; font-size:100%; }
h1 { font-size: 2.5em; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.75em; }
h4 { font-size: 1.5em; }
h5 { font-size: 1.25em; }
h6 { font-size: 1em; }
small { font-size:80%; }
strong { font-weight:bold; }
code, kbd, pre, samp {
    font-family: monospace, serif;
    font-size: 1em;
}
pre { white-space: pre-wrap; }
a { text-decoration:none; }
p { font-size:1em; margin:1em 0; }

.error { color:#ff0000; font-weight:bold; }

/* forms */
input, button, select, textarea { font-family: inherit; }
button, input[type=submit] { cursor: pointer; }
label { font-weight:bold; }

/* colours */
a:link { color: #ddd; }
a:hover { color: #ddd; }
a:active { color: #ddd; }
a:visited { color: #ddd; }

/* miscellaneous */
::selection { background-color:#ff0000; }
::-moz-selection { background-color:#ff0000; }
.clear { clear:both; }
.clear_l { clear:left; }
.clear_r { clear:right; }
.float_l { float:left;  }
.float_r { float:right; }

.container { max-width: 1200px; margin: 1em auto; }
.container-pad {...