JSFiddle - React, Tailwind, and code Playground

by Love Trivedi

HTML

<body>
	<div id="page-wrapper">
		<div id="header">
			<h1>Matócza Tünde</h1>
			<h2>webdesigner</h2>
		</div>

		<div id="main">
			<ul>
				<li>Blog<a href="http://matocza.blogspot.hu">matocza.blogspot.com</a></li>
				<li>Twitter<a href="https://twitter.com/matocza_tunde">@matocza_tunde</a></li>
				<li>Google+<a href="https://plus.google.com/u/0/101717548397386490927/posts">Google+</a></li>
				<li>Contact me<a href="mailto:[email protected]">[email protected]</a></li>
			</ul>
		</div><!--end of page-wrapper-->
	</div> <!--end of page-wrapper-->

</body>
</html>

CSS

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video {	margin: 0;	padding: 0;	border: 0;	outline: 0;	font-size: 100%;	font: inherit;	vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {	display: block;}
body {	line-height: 1;}
ol, ul {	list-style: none;}
blockquote, q {	quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {	content: '';content: none;}
/* remember to define visible focus styles! 
:focus {
	outline: ?????;
} */
/* remember to highlight inserts somehow! */
ins 	{	text-decoration: none;}
del 	{	text-decoration: line-through;}
table 	{	border-collapse: collapse;	border-spacing: 0;}
/* end of reset */

body {
	width: 80%;
	margin: 0 auto;
}

.page-wrapper {
	width: 80%;
}

.header {
	height: 100px;
}

h1 {
	font-size: 40px;
	padding-top: 50px;
}

ul {
	list-style: none;
	display: block;
	margin-top: 20px;
	font-size: 20px;
}

li {
	margin: 0px 10px 0px 100px;
	padding: 30px 5px 0px 5px;
	border-bottom: 2px solid black;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	display: block;
	  -moz-transition: background-color .3s ease-in;
	  -webkit-transition: background-color .3s ease-in;
	  -o-transition: background-color .3s ease-in;
	  transition: background-color .3s ease-in;
	}
	li:hover {
		background-color: #CCC;
		-moz-transition: background-color 0.01s;
 		-webkit-transition: background-color 0.01s;
  		-o-transition: background-color 0.01s;
  		transition: background-color 0.01s;
	}

a {
	float:...