Top Navigation Bar Code


Place below code at the end of the HEAD section of your code.

body {
margin: 0;
font-family: Arial, Helvetica, sans-serif;

.topnav {
overflow: hidden;
background-color: #333;

.topnav a {
float: left;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;

.topnav a:hover {
background-color: #ddd;
color: black;

.topnav {
background-color: #04AA6D;
color: white;


Place below code in BODY section of your code where you want the Nav Bar to be located.

<div class="topnav">
<a class="active" href="#home">Home</a>
<a href="#news">News</a>
<a href="#contact">Contact</a>
<a href="#about">About</a>