对于我的网站的主导航，有一个980像素宽的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列表水平(float：left，display：block)。我可以调整李的填充，使它非常接近，但我真正需要的是一种方法，使其伸展自动适应。可能？
解决方法
这是最简单的方法：
http://jsfiddle.net/thirtydot/jwJBd/
(或表格布局：对于均匀宽度分布固定：http://jsfiddle.net/thirtydot/jwJBd/59/)
这个won’t work在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;
}
旧答案在编辑之前：http://jsfiddle.net/thirtydot/DsqWr/
