JSFiddle - React, Tailwind, and code Playground
HTML
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="test.css" />
<meta charset=utf-8>
<title>Test</title>
</head>
<body >
<article >
<header>
<h1>This is Title</h1>
<nav>
<h3>
<a href="">Home</a> |
<a href="">Works</a> |
<a href="">Blog</a> |
<a href="">Contact</a>
</h3>
</nav>
<div class="clr"></div>
</header>
</article>
</body>
</html>
CSS
body {
font-family:"Verdana", Verdana, sans-serif;
font-size: 1em;
font-weight:400;
}
h1 {
font-family:"Century Gothic", Verdana, sans-serif;
font-size: 4em;
font-weight:400;
display:inline-block;
}
h3 {
font-family:"Verdana", Verdana, sans-serif;
font-size: 1.2em;
font-weight:400;
}
h5 {
font-family:"Verdana", Verdana, sans-serif;
font-size: 0.75em;
font-weight:400;
}
a:link {color:rgba(50,170,255,1);} /* unvisited link */
a:visited {color:rgba(35,127,190,1);} /* visited link */
a:hover {color:rgba(152,214,255,1);} /* mouse over link */
a:active {color:rgba(152,214,255,1);} /* selected link */
//HEADER
header div {
float: left;
margin-left:10px;
}
header nav {
margin-right: 10px;
float: right;
margin-top: 30px;
}
.clr {clear:both;}