水平拉伸 ul 以适合 div 的宽度

对于我网站的主导航，有一个 980px 宽的 div 和一个用于主导航链接的 ul。我试图使导航链接拉伸以均匀地适应 div 的宽度。

<div style="width: 980px;">
<ul id="horizontal-style">
  <li><a href="#">Nav Item</a></li>
  <li><a href="#">Short Item</a></li>
  <li><a href="#">Really Long Nav Item</a></li>
  <li><a href="#">Nav Link</a></li>
  <li><a href="#">Another Link</a></li>
</ul>
</div>

我正在做一些典型的CSS来使ul水平列表（浮动：左，显示：块）。我可以调整 li 的填充以使其非常接近，但我真正需要的是一种使其拉伸以自动适应的方法。可能的？

Edit难点一：不会使用表格。 困难 2：每个导航项都有不同的宽度，以适应较长和较短的链接名称。

这是最简单的方法：http://jsfiddle.net/thirtydot/jwJBd/ http://jsfiddle.net/thirtydot/jwJBd/

（或与table-layout: fixed对于均匀宽度分布：http://jsfiddle.net/thirtydot/jwJBd/59/ http://jsfiddle.net/thirtydot/jwJBd/59/)

This 行不通 http://caniuse.com/css-table in IE7.

#horizontal-style {
    display: table;
    width: 100%;
    /*table-layout: fixed;*/
}
#horizontal-style li {
    display: table-cell;
}
#horizontal-style a {
    display: block;
    border: 1px solid red;
    text-align: center;
    margin: 0 5px;
    background: #999;
}

_{Old answer before your edit: http://jsfiddle.net/thirtydot/DsqWr/ http://jsfiddle.net/thirtydot/DsqWr/}