title: CSS text-align: center; is not centering things
body: <p>I have the following html:</p>
  <pre><code>&lt;div id=&quot;footer&quot;&gt;
      &lt;ul id=&quot;menu-utility-navigation&quot; class=&quot;links clearfix&quot;&gt;
          &lt;li class=&quot;menu-685 menu-site_map first&quot;&gt;Site Map
          &lt;/li&gt;
          &lt;li class=&quot;menu-686 menu-privacy_policy&quot;&gt;Privacy Policy
          &lt;/li&gt;
          &lt;li class=&quot;menu-687 menu-terms___conditions&quot;&gt;Terms &amp;amp; Conditions
          &lt;/li&gt;
          &lt;li class=&quot;menu-688 menu-contact_us last&quot;&gt;Contact Us
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  <p>With the following CSS:</p>
  <pre><code>div#footer {
      font-size: 10px;
      margin: 0 auto;
      text-align: center;
      width: 700px;
  }
  </code></pre>
  <p>I threw in the font-size bit just to see if the style was working (Firebug reports it is working but I wanted to see).  It is working.  But the text is not centered in the footer in Firefox or in Safari (have yet to check it in IE).</p>
  <p>I tried with and without margin: 0 auto; and with and without text-align: center; no combo of those things worked.</p>
  <p>Here is output from Firebug:</p>
  <pre><code>div#footer {
      font-size: 10px;
      margin: 0 auto;
      text-align: center;
      width: 700px;
  }
  
  Inherited fromdiv#page
  #skip-to-nav, #page {
      line-height: 1.5em;
  }
  
  Inherited frombody.html
  body {
      color: #666666;
      font-family: verdana,arial,sans-serif;
  }
  </code></pre>
  <p>Help?</p>