title: How do I *really* justify a horizontal menu in HTML+CSS?
body: <p>You find plenty of tutorials on menu bars in HTML, but for this specific (though IMHO generic) case, I haven't found any decent solution:</p>
  
  <pre><code>#  THE MENU ITEMS    SHOULD BE    JUSTIFIED     JUST AS    PLAIN TEXT     WOULD BE  #
  #  ^                                                                             ^  #
  </code></pre>
  
  <ul>
  <li>There's an varying number of text-only menu items and the page layout is fluid.</li>
  <li>The first menu item should be left-aligned, the last menu item should be right-aligned.</li>
  <li>The remaining items should be spread optimally on the menu bar.</li>
  <li>The number is varying,so there's no chance to pre-calculate the optimal widths.</li>
  </ul>
  
  <p>Note that a TABLE won't work here as well:</p>
  
  <ul>
  <li>If you center all TDs, the first and the last item aren’t aligned correctly.</li>
  <li>If you left-align and right-align the first resp. the last items, the spacing will be sub-optimal.</li>
  </ul>
  
  <p>Isn’t it strange that there is no obvious way to implement this in a clean way by using HTML and CSS?</p>