Navigation Menus

Here you can find some cool navigation menus I've made myself and put up for free. All of them are for free use, but I would appreciate if you linked back to PGCode or PGReviews! Thanks.

Menu List

PGCode Menu

This menu is the one you use to cycle through all the codes on PGCode. It uses only one small image, the rest colours, so is very small in filesize. Of course, the colours are changeable, but I kept them as you see on the site, so it's easy to tell what does what.

→ CSS

Select All

#nav {
background: #202020;
color: #ffffff;
text-align: center;
min-height:  92px;
}

#nav ul {
padding: 0px;
margin: 0px;
font-size: 12px;
}

#nav li {
margin: 0px;
padding: 1px 0px 1px 0px;
list-style: none;
}

#nav a {
background: #383838;
display: block;
color: #ffffff;
text-decoration: none;
width:  80px;
}

#nav .current {
background: #000000;
text-decoration: none;
color: #ffffff;
width: 100px;
margin:  0px -10px 0px 0px;
}

#nav a:hover {
background: #2b2d2d;
color: #ffffff;
text-decoration: none;
width:  90px;
}

→ HTML

Select All

<div id="nav">
<ul>
<li><a href="page.html">Page</a></li>
<li><a href="page.shtm">Longer <br /> Page</a></li>
<li><a href="page.html">Another Page</a></li>
<li><a href="page.html" class="sub-category">Sub-Category Page</a></li>
</ul>
</div>

All Your Code Are Belong To Us

Navigation Menus

Menu List

PGCode Menu

→ CSS

→ HTML

Code Browser

New/Recently Added