[RESOLVED] centering navigation bar

[jake7363]

hello,
I have a javascript navigation bar I am trying to center in a <div>. Because I don't want to fix a width to the div, I am using percentages which -from what I read- makes it impossible to use CSS to center the bar. I have tried all the methods mentioned in CSS forums to find out for myself.
It has been a while (a few years) since I did any web developing, my Dreamweaver is out of date (and I am out of touch) with HTML 5 and CSS3. Prior to that, the software I used to create the menu had a plug-in for DW and it centered it automatically. Now, I need to do it manually and can only believe that it is a function of javascript.
To keep it simple, here is my example:

HTML-
<div class="navbar">
<script type="text/javascript" src="navbars/navTop/biztech.js"></script>
</div>

CSS-
.navbar{
display:block;
margin:0 auto;
width:100%;
}

I tried using "ul {display:inline-block;}", but that didn't work, either.

Any help is appreciated.

Jake

[grumpyOleMan]

Your experience with using Dreamweaver should have taught you that those kinds of programs have a very big flaw. We become lazy and do not learn the intricacies of web development.

Now your question is how to centre a navigation bar which is in a div.

The css for the div’s class=navbar can be removed as it does nothing beneficial as presented.

As for the unordered list’s css, surely you mean to apply it to the list items.

li{display:inline-block;}

To centre them try text-align on the unordered list and then the result will depend on how many list items you eventually have within the div.

[pdiddles03]

First off, I would suggest not using Javascript for a navigation. This is not a good idea because:

1. Spiders cannot parse Javascript
2. If spiders cannot parse Javascript, Google has trouble
3. People who have no javascript, or disabled javascript cannot use the links.

As for centering your list if you don't want the circles for the ul use this css

.navbar ul{
list-style-type: none;
}
#.navbar ul li{
float: left;
text-align: center;
margin-left: auto;
margin-right: auto;
display: block;
}

[jake7363]

Thanks guys, but none -of-the-above worked.

To the comment about the "lesson," it might be helpful to realize that I don't portend (nor is it my aspiration) to be a web-developer guru. For me, the pages I am creating are purely utilitarian and not a goal, in and of themselves; hence, I've no need of being more technical than time allows. I do want the pages to be free of errors while serviceable.. While I tip my hat to those proficient ones, for my purposes I am working smarter, not harder.

And I do have a means to support non-javascript users, as well.

To that end, my resolution came with just a short, simple markup line within the div that solved the problem. But I sincerely do appreciate your responses and attempts to be helpful.

Blessings,
Jake