CSS Centering Problems or Why I'll Probably Make it From Scratch Next Time

[Ԍuest]

So I am pretty much just jumping in to CSS, PHP and maybe Javascript very soon. This was not my idea because its not my actual job, but whatever, I am getting paid to learn this stuff and come up with a great teaser site for work. It beats answering the phones and listening to people complain about their stocks.

Enough talk! NOW WE CODE!!! Or in my case, take something easy and tweek it until it works and then go OH I see now!

So here is the mockup site:
http://dojo.secretworldwideorgofunitedninja.pcriot.com/index.php

Here is the CSS code for the navigation bar:
http://pastebin.com/zBgKWuqW

As you can tell, I did not do this myself and some of this code needs to meet the cutting room floor because there are no dropdowns, but templates (I thought) would be quick and easy so why not? Because I cannot figure out which of these values needs to have itself doing it or exactly why align:center or position:center just won't cut it.

Arigatou in advance. *bow*

 

[misson]

What's the issue? When asking for help, you should describe exactly what you want and compare it to what you have.

Rather than guessing at what CSS properties exist and what they are, find a good reference. Nothing beats the CSS 2.1 specification, but if you find it hard to read, there are other CSS references. HTML Dog's CSS tutorials may also be helpful (I haven't taken a close look, so I can't speak to their quality with any surety, but what I've seen looks good).

There is no "center" value for the "position" property. Use "position" to choose a positioning scheme, not alignment. Centering is handled with other properties. For horizontal alignment, there's the text-align property for inline boxes, or the left & right margin properties (set to "auto") for block boxes.

 

[Ԍuest]

Oh man, I have to stop posting so late at night.

Issue: The menu bar was not centered. Now it is centered, but instead of being horizontal its vertical. D'oh! So close yet so far.

 

[tommieonos84]

that's one hell of a menu you've chosen there...

but to make it a bar instead of a square, you'll have to do set display:block to display:inline, but you have to figure out yourself wich ones. I guess the li and maybe the A

 

[Ԍuest]

Yay! Its fixed. Thanks Tommieonos84