index.html

<p>Add an unlimited number of items to the navigation and the spacing will <em>always</em> fit the given viewport.</p>
<p class="warning">This is <strong>not</strong> compatible < IE 8</p>
<div class="wrapper">
  <nav class="container">
    <div class="nav inner">
      <ul>
        <li><a href="#">Foo</a></li>
        <li><a href="#">Foo</a></li>
        <li><a href="#">Foo</a></li>
        <li><a href="#">Foo</a></li>
        <li><a href="#">Foo</a></li>
        <li><a href="#">Foo</a></li>
        <li><a href="#">Foo</a></li>
        <li><a href="#">Foo</a></li>
        <li><a href="#">Foo</a></li>
      </ul>
    </div>
  </nav>
</div>

jquery.js

var $items = $(".nav > ul").children().length;

$(".nav > ul > li").width(100 / $items + "%");

style.scss

@import "compass/css3";

body { font: normal 14px Arial, sans-serif; }
.warning {
  background: lighten(yellow, 35%);
  padding: 5px;
}
.wrapper {
  width: 100%;
  background-color: #eeeeee;
  @include filter-gradient(#eeeeee, #cccccc, vertical);
  $experimental-support-for-svg: true;
  @include background-image(linear-gradient(top,  #eeeeee 0%,#cccccc 100%));

  nav {
    .nav {
      ul {
        list-style: none;
        margin: 0;
        padding: 0;
        display: table;
        li {
          // float: left;
          display: table-cell;
          text-align: center;
          white-space: nowrap;
          width: 16.6667%;
          line-height: 2.4;
          @include transition(background-color, 0.3s);
          &:hover {
            background-color: rgba(255, 255, 255, 0.4);
          }
          a {
            text-decoration: none;
            color: darken(#dbdbdb, 50%);
            @include text-shadow(0 1px 1px white);
            font: {
              size: 20px;
              weight: bold;
            };
            &:hover { text-decoration: none; }
          }
        }
        &:after {
          clear: both;
          display: block;
          height: 0;
          visibility: hidden;
          content: "\0020";
        }
      }
    }
  }
}