Trouble to center navbar with css

[Russia]

Hey guys, I am having trouble centering a navbar with css on my template.

 

 

Here is a jsfiddle live preview for you.

 

http://jsfiddle.net/LRS38/

 

I added text-align:center; to it but it still wont center. I also added a margin:0 auto; but no luck.

 

Can anyone see what I am doing wrong?

	<div id="navigation">
		<ul>
			<li><a href="#">Home</a></li>
			<li><a href="#">About</a></li>
			<li class="current"><a href="#">Services</a></li>
			<li><a href="#">Contact us</a></li>
		</ul>
	</div>

and

#navigation {
text-align:center;
background-color:#ef6b51;
overflow:hidden;
}

[cyberRobot]

You could set the width of the <ul> tag:

 

#navigation ul {
    margin:auto;
    width:500px;
}

[Russia]

 

You could set the width of the <ul> tag:

#navigation ul {
    margin:auto;
    width:500px;
}

I thought about that, but I would have to figure out the exact pixels to keep on each side, is there way to set it as like 50% of 960?

[cyberRobot]

If you don't want to set the width, changing the display property also seems to work:

 

#navigation ul {
    margin:auto;
    display:inline-block;
}