//CSS style
#main-pnav ul li a {
text-decoration: none;
padding: 13px 14px 10px 14px;
height: 23px;
display:block;
float:left;
}
#main-pnav ul li#select a, #main-pnav ul li.selected a {
background: url(images/pnav-select.png) repeat-x;
}
#main-pnav ul li ul {
display: none;
float: left;
font-size: 0.6em;
padding: 0;
margin: 0;
clear: both;
}
#main-pnav ul li ul li {
background: #061a29;
width: 150px;
height: auto;
position: relative;
clear: both;
}
#main-pnav ul li#select ul li a {
background: none;
}
#main-pnav ul li ul li a {
padding: 3px;
}
#main-pnav ul li ul li:hover {
background: #164466;
}
#main-pnav ul li ul li ul li {
background: #061a29;
width: 120px !important;
height: 20px;
padding: 3px 0px 3px 30px;
}
#main-pnav ul li ul li ul {
/*position: absolute;
top: 20px;
left: 0;*/
font-size: 0.8em;
}
#main-pnav ul li:hover ul {
display:block;
}
#main-pnav ul li a:hover {
text-decoration: underline;
}
//HTML
<ul>
<li id="select" style="" class="pnav-link"><a href="/art/">Art</a></li><li style="float:right;" class="pnav-link"><a href="/art/upload/">+</a></li>
<li style="" class="pnav-link"><a href="/art/list/">Browse</a>
<ul>
<li><a href="Array">Category</a>
<ul>
<li><a href="/art/list/1/date/">Wallpapers</a></li>
<li><a href="/art/list/2/date/">Test</a></li>
</ul>
</li>
<li><a href="Array">View by</a>
<ul>
<li><a href="/art/list/0/date/">Date</a></li>
<li><a href="/art/list/0/rating/">Rating</a></li>
<li><a href="/art/list/0/name/">Name</a></li>
</ul>
</li>
</ul>
</li>
</ul>