CSS navigation help

programming web dev
1

Hey

I have a navigation bar and I want to align it to the center. I tried to find help on google but nothing worked successfully.
Here’s the navigation CSS code;


#navigation { background: #000; border-bottom: 18px solid #111111; height: 60px; width: 897px;}
 
#navigation ul { list-style-type: none; margin: 0; padding: 0;}
#navigation ul li { display: inline;}
#navigation ul li a { float: left; display: block; width: 101px; color: #fff; 
border-bottom: 7px solid #353535; border-left: 1px solid #353535; padding: 30px 5px 10px 5px;}
 
#navigation ul li a:hover { border-bottom-color: #fff; color: #68b01b;}

If anyone can help me out then great.

2

what part of the code do I put it in?

3

I have added that code but it hasn’t changed at all.
Here’s the link;
http://novaone.co.uk/magic/tools.html

The navigation bit is where it says; home, about me, photos, videos and contact (which you probably could have guessed :P)

4

It is now


#navigation { display: block; position: relative; margin: 0 auto; background: #000; border-bottom: 18px solid #111111; height: 60px; width: 897px;}
#navigation ul { list-style-type: none; margin: 0; padding: 0;}
#navigation ul li {  display: inline;}
#navigation ul li a { float: left; display: block; width: 101px; color: #fff; border-bottom: 7px solid #353535; border-left: 1px solid #353535; padding: 30px 5px 10px 5px;}
#navigation ul li a:hover { border-bottom-color: #fff; color: #68b01b;}
5

Okay, it doesn’t seem to work though.
I’m not sure what HTML DTD is? Where could I find out?
I checked out that link and it says add this code;

 
body {text-align: center;}

#container {margin: 0 auto;width: xxxpx;}

ill try this is the #navigation css code.

6

Okay, I have now tried to add


display: block; position: relative; margin: 0 auto;

in the #navigation css code and it doesnt work. Nothing I have tried has worked. I have been able to center the text and also been able to make the navigation display in rows underneath each other but cannot get it centered.

7

Yes I used the code off that also.

8

oh i only using the bit which is in the #container and put it in my css file. Will I need to put the css on the actual page?

9

Okay so I added that code onto the tools.html page and has made no difference to the navigation section. Only the content, moved the bullet pointed text to the left and is not right. Take a look
http://novoane.co.uk/magic/tools.html

10

Yes the site is I think why

11

Done this but no change :S

12

okay changed that also and still no alteration. Lets face it, it’s not gonna work lol.

13

Is this in the css file because there is no option for width or height.

14

Will I need to replace this bit


margin: 0 auto;

with


width: 500px;
15

Thanks so much, this has worked :smiley:

16

For years now video [color=#0000ff]AOC Gold[/color] gamers have been seeking assistance [url=http://www.usfine.com/Runescape-Powerleveling-c-90.html][color=#0000ff]Age of Conan Gold[/color] in playing and conquering the games that they live for. This assistance is sometimes found online, from television shows, or printed cheat materials. [url=http://www.usfine.com/Age-of-Conan-US-PL-c-146.html][color=#0000ff]Age of Conan Power Leveling[/color] Many of these items have successfully helped gamers achieve victory, but they cannot help with all games. [url=http://www.usfine.com/Age-of-Conan-US-PL-c-146.html][color=#0000ff]AOC Power leveling[/color] Using weapons to conquer and efeat may not sound that difficult, but if you have played before than you may realize that it is not as easy as it sounds. The good and valuable weapons must be paid for with . The easiest way to find is to buy it. Similar to the above mentioned resources, purchasing is a great way for a player to enjoy and [url=http://www.usfine.com/Age-of-Conan-US-PL-c-146.html]Age of Conan PowerLeveling conquer the game.