how can I center this menu with CSS

Question

I have this menu fixed, how can I center this menu?
I already tried with margin: 0 auto, and float: left, but it doesn\'t work.
Are there any way to center ??
he

Answer 1

You can change the #mainnav li as from float: left; to display: inline-block;

#main-nav li {
    position: relative;
    margin: 0 auto;
    padding: 0;
    list-style: none;
    display: inline-block;
}

and then you can use text-align: center; on the ul.

#main-nav {
...
     text-align: center;
...
}

Working Demo: http://jsfiddle.net/rSc9s/