[SOLVED] Horizontal Navigation Bar

[cshanks]

I have spent quite some time trying to figure this out. I have a feeling that i have looked at it too much and am missing something simple. I am trying to do a horizontal navigation bar. I have searched the internet and tried so many examples. I cannot replicate any of the examples I found. So I broke it way down to basic code...I can't even get the bullets to disappear...Boy, I feel stupid!

By the way, I am using Firefox but have tried viewing on Safari and IE also. No luck in any of the browsers.

Here is my CSS code:

Code: Select all

div#navbar
    {
    }

div#navbar ul
    {
    list-style: none;
    list-image: none;
    margin: 0;
    padding: 0;
    }

Here is my XHTML code:

HTML: Select all

<div id="navbar">
<ul>
<li><a href="#">January</a></li>
<li><a href="#">February</a></li>
<li><a href="#">March</a></li>
<li><a href="#">April</a></li>
<li><a href="#">May</a></li>
<li><a href="#">June</a></li>
<li><a href="#">July</a></li>
<li><a href="#">August</a></li>
<li><a href="#">September</a></li>
<li><a href="#">October</a></li>
<li><a href="#">November</a></li>
<li><a href="#">December</a></li>
</ul>
</div>

Any suggestions? Thanks

[smdesignworks]

div#navbar li
{
display:inline;
}

Just toss that in there :P

[smdesignworks]

I forgot that you mentioned the bullets weren't disappearing, so I was curious and actually threw this in dreamweaver, I don't see them though. I know most elite webmasters would frown upon this, but I use a global reset to get rid of junk like that list-style, I tend to use

* { margin: 0; padding: 0; border: none; list-style: none; }

Its more out of habit, but it works, then you won't even have to deal with dropping the bullets, but if you need them somewhere else on the page you actually have to call them up in the CSS file. I just never use the defaults.

[Monie]

Yeah, It was easy...
I face the same problem few years ago.

Here are some of the COMPLETE guide of how to make a "CSS Horizontal Menu"

[karinne]

Alistapart has a great article on this - CSS Design: Taming Lists

[cshanks]

I think I got my menus working. Thanks for all the advice!