Webmaster Forum / HTML, CSS, Scripts / CSS / June 2006

Hi

Can anybody help me with my CSS navigation.  I want it to appear on one
line - horizontally, but the menu items are displayed under one
another?

Any ideas from my code where I am going wrong?

     <ul class="nav">
       <li><a href="index.htm"class="current">Home</a></li>
       <li><a href="services.htm">Services</a></li>
       <li><a href="clients.htm">Clients </a></li>
       <li><a href="work.htm">Work</a></li>
       <li><a href="links.htm">Links</a></li>
       <li><a href="quality.htm">Quality</a></li>
       <li><a href="news.htm">News </a></li>
       <li><a href="profile.htm">Profile</a></li>
       <li><a href="contact.htm">Contact</a></li>
     </ul>

ul {margin: 0px 0px 2em 20px; padding: 0px 0px 50px 20px; list-style:
url("bullet.gif"); color: #515752; font:1em Verdana, Arial, Helvetica,
sans-serif;  line-height:1.6em;}
#leftcol ul {margin: 0px 0px 2em 20px; padding: 0px 0px 0px 20px;
width: 354px !important; width /**/:374px;  list-style:
url("bullet.gif"); color: #515752; font:1em Verdana, Arial, Helvetica,
sans-serif;  line-height:1.6em;}
li {margin: 0px 0px 0.2em 0px; padding: 0em 0px 0px  0px;}
ul ul {margin: 0px 0px 0px 0em;}

.nav {list-style: none; list-style-image: none; margin: 0px 0px 30px
0px; padding: 0px; width:182px; border-top: 1px solid #B7BBB7;}
.nav li { margin: 0px; padding: 0px; font:1em Verdana, Arial,
Helvetica, sans-serif; border-bottom: 1px solid #B7BBB7;}
.nav li a, #nav li a:visited {display: inline; color: #cccccc;
text-decoration:none; line-height: 19px; margin: 0px; padding: 0px
14px; width:154px !important; width /**/:184px; background-image:none;}
.nav li a span {display: none; margin: 0px; padding: 0px;}
.nav li a:hover {color: #ffffff;}
.nav li a:hover span {display: inline; color: #fff;}
.nav li a.current, #nav li a.current:visited, #nav li a.current:hover
{background: #625e5a; color: #fff;}
.nav li a.current span, #nav li a.current:visited span, #nav li
a.current:hover span {display: none;}