runescape navigation bar

[infinitym4ge]

Create your own fagex style navigation bar

Working sample .. www.ready-business.co.uk//rsnavbar/index.html

CSS codes

#button {
width: 114px;
height: 26px;
font-family: "Trebuchet MS" }

#button ul {
list-style: none;
margin: 0;
padding: 0;
border: none;
}

#button li {
border-bottom: 0 0 0 0;
margin: 0;
}

#button li a {
* * padding: 2px 0 0 0;
* * display: block;
* * width: 114px;
* * height: 26px;
* * * * background: url('images/top.png') no-repeat;
color: #fcd56b;
text-decoration: none;
}

html>body #button li a {
width: auto;
}

#button li a:hover {
padding: 2px 0 0 0;
* * display: block;
* * width: 114px;
* * height: 26px;
* * * * background: url('images/bottom.png') no-repeat;
color: #1c1d1f;
text-decoration: none;
}

Html codes

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>navigation</title>
<link href="styles.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.style1 {
text-align: center;
}
</style>
</head>

<body style="background-color: #1C1D1F">


<div id="button">
<ul>
<li class="style1"><a href="#"><strong>Home</strong></a></li>
<li class="style1"><a href="#"><strong>Play Now</strong></a></li>
<li class="style1"><a href="#"><strong>Account</strong></a></li>
<li class="style1"><a href="#"><strong>Game Guide</strong></a></li>
<li class="style1"><a href="#"><strong>Comunity</strong></a></li>
<li class="style1"><a href="#"><strong>Log In</strong></a></li>

</ul>
</div>

</body>

</html>

images

top

bottom

.rar download link .. www.ready-business.co.uk/rsnavbar/rsnavbar.rar

Rep if you like* :r_flame:

Disclamer.. No fagex codes or images where used im the making of this navigation style so no copyright issues have been infringed although i do not take any responsibility for any action possibly taken by fagex,