How to centrally align a float: left ul/li navigation menu with css?

Question

So I have the following CSS in place to display a horizontal navigation bar using:

.navigation ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.naviga         


        

Answer 1

Well, to use margin:0 auto on something, it must have a defined width. Probably the best workaround is:

ul li {
  display: inline;
  list-style-type: none;
}
ul {
  text-align:center;
}