在水平导航上均匀分布链接

Question

我正在尝试找到一种简单的方法,让所有链接均匀分布在水平导航上.如果它是固定数量的链接,这将是非常容易的,但它们将是动态的.

所以它可能是5或10个链接,没人知道.尽管有大量的链接我希望它们在不使用表格的情况下均匀地分布在导航中.

我不想使用表的原因是因为它会破坏UL LI结构,这显然是构建导航(SEO)时的方式.

这里有一个jsFiddle更深入地解释它:http://jsfiddle.net/pkK8C/19/

寻找最轻的方法.

先感谢您.

Answer 1

旧的浏览器可能很头疼,但它适用于新的浏览器:

div#navigation ul {
    list-style-type:none;
    height:30px;
    text-align:center;
    width: 100%;      /* new */
    display: table;   /* updated */
}

div#navigation ul li {        
    margin-left:50px;
    display: table-cell;  /* updated */  
}

Answer 2

使用display: table了UL和display: table-cell为LI.和IE6/7的display-table.htc一样重要.