title: Center Navigation Bar with FIXED WIDTH
body: <p>Someone told me that it would be hard to center an navigation bar with fixed width. Is it true? That's my itch right now.</p>
  
  <p>Here's my navigation bar CSS:    </p>
  
  <pre><code>nav ul{
    list-style-type: none;
    padding: 15px 0px 32px 0px;   
  }
  
  nav ul ul{
    display: none;
  }
  
  
  nav ul li{
    display: inline;
    float: left;  
  }
  
  nav ul a{
    color:#666;
    background-color:#CCC;
    text-align: center;
    text-decoration: none;    
    padding: 20px 20px 20px 20px;
    font-family:Arial, Helvetica, sans-serif;     
  }
  
  nav ul a: hover{
    color: #FFF;
    background-color: #F60;   
  }
  </code></pre>
  
  <p>Here is my HTML CODES:</p>
  
  <pre><code>&lt;nav&gt;
  
      &lt;ul&gt;
      &lt;li&gt;&lt;a href="index.html"&gt;HOME&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="products_and_services.html"&gt;PRODUCTS &amp;amp; SERVICES&lt;/a&gt;&lt;/li&gt;
          &lt;ul&gt;
              &lt;li&gt;&lt;a href=""&gt;BROCHURES&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href=""&gt;BUSINESS CARDS&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href=""&gt;MAGAZINES&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href=""&gt;BOOKS&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href=""&gt;WEB DESIGN&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;          
      &lt;li&gt;&lt;a href="gallery.html"&gt;GALLERY&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="support.html"&gt;SUPPORT&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="contact_us.html"&gt;CONTACT US&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="about_us.html"&gt;ABOUT US&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  
  &lt;/nav&gt;
  </code></pre>