JSFiddle - React, Tailwind, and code Playground

by panchroma

HTML

<link rel="stylesheet" href="https://raw.github.com/dhg/Skeleton/master/stylesheets/base.css">
<link rel="stylesheet" href="https://raw.github.com/dhg/Skeleton/master/stylesheets/skeleton.css">
<link rel="stylesheet" href="https://raw.github.com/dhg/Skeleton/master/stylesheets/layout.css">
<!--HEADER -->
<div id="nav-container" class="container">
 <div class="six columns navigation navigation-left">
     <ul>
         <li><a href="#" title="Home">Home</a></li>
         <li><a href="#" title="Projects">Projects</a></li>
         <li><a href="#" title="Blog">Blog</a></li>
     </ul>
 </div>
 <div id="logo" class="four columns hide-mobile">
     <h1><a href="#" title="Aleem Guialap">Aleem Guialap</a></h1>
 </div>
 <div class="six columns navigation navigation-right">
     <ul>
         <li><a href="#" title="About">About</a></li>
         <li><a href="#" title="Gallery">Gallery</a></li>
         <li><a href="#" title="Contact">Contact</a></li>
     </ul>
 </div>
</div>

CSS

/**************************/
/*   NAVIGATION           */
/**************************/


.navigation-right{text-align:right}
.navigation-right li{margin-right:40px}
.navigation-left li{margin-left:40px}
.navigation li{display:inline; line-height:130px}
.navigation a{text-decoration:none; color:#4d4d4d; font-size:25px}
.navigation a:hover{color:#7e2d2d}
;
#logo h1 a{margin-top:20px; margin-bottom:20px; background:url(images/logo.png) no-repeat; display:inline-block; width:173px; height:105px; text-indent:-99999px;}