JSFiddle - React, Tailwind, and code Playground

by Maulik Anand

HTML

<nav>
<ol>
<li class="home"><a href="home.php"></a></li>
<li><a href="Info.php">Info</a></li>
<li><a href="projects.php">Projects</a></li>
<li><a href="contact.php">Contact</a></li>
</ol>
</nav>

CSS

/******************************************* 
            Links
*******************************************/

a:link {
font-family: 'Iceland';
font-style: normal;
font-size: 30px;
font-weight: 700;
text-decoration: none;
color: #666;
}

a:visited {
color: #666;
}

a:hover {
color: #F90;
}

a:active {

}


/******************************************* 
            Navigation
*******************************************/

nav {
width: 100%;
bottom: 0;
left:0;
height: 60px;
position: fixed;
background-color: #333;
}

ol {
list-style: none;
text-align: center;
height: 100%;
}

li {
display: inline;
padding-right: 40px;
}

li a {
}


/******************************************* 
            Class
*******************************************/

.home {
background: url(http://explorelaromana.com/wp-content/themes/explorelaromana/images/home_icon.jpg);
}


/******************************************* 
            ID's
*******************************************/

#main {
background-color: #C90;
width: 90%;
height: 84%;
margin: 5% auto;
}