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

css, css-float, html

Solution

Give your .navigation ul a width and use margin:0 auto;

.navigation ul 
{
  list-style: none;
  padding: 0;
  width: 400px;
  margin: 0 auto;
}

Problem

So I have the following CSS in place to display a horizontal navigation bar using: ``` .navigation ul { list-style: none; padding: 0; margin: 0; } .navigation li { float: left; margin: 0 1.15em; /* margin: 0 auto;*/ } .navigation { /* width: auto;*/ /* margin: 0 auto;*/ text-align: center; } ``` My question is: how do I align the navigation bar centrally above the title?

Original source