Jquery 使用填充物拉伸ul li菜单以适应整个宽度

我有一个浮动ul/li（the）菜单，即宽度不断变化，但我想填充包含div的完整宽度

守则：

#main-content ul.jwts_tabbernav {  
    display: block;
    margin-bottom: 20px;
    text-transform: uppercase; 
    text-align: center; 
}

#main-content ul.jwts_tabbernav li a,
#main-content ul.jwts_tabbernav li a:link, 
#main-content ul.jwts_tabbernav li a:hover {
    background: none repeat scroll 0 0 transparent;
    border: 1px solid #734C2F; outline: 1px solid #734C2F;
    color: #734C2F;
    font-size: 12pt;
    font-weight: bold; 
    margin: 0;
    padding: 3px 35px;
}

开发页面（具有两种不同的菜单宽度）：

---

知道如何解决这个问题吗？

假设我理解正确，您只需在

li

元素

中设置
a
元素
显示：block
：

#main-content ul.jwts_tabbernav li a,
#main-content ul.jwts_tabbernav li a:link, 
#main-content ul.jwts_tabbernav li a:hover {
    background: none repeat scroll 0 0 transparent;
    border: 1px solid #734C2F; outline: 1px solid #734C2F;
    color: #734C2F;
    font-size: 12pt;
    font-weight: bold; 
    margin: 0;
    padding: 3px 35px;
    display: block;
}

设置显示块

#menu a {
    display: block;
}

以下更改将使列表项展开以填充容器

ul {
    display:table;
    width:100%;
}

li {
    display:table-cell;
}

a {
    display:block
}

需要注意的一点是，IE6/7本机不支持和，因此如果需要支持这些浏览器，则需要另一种解决方案。只有7.1%和2.54%，我知道支持他们的设计师越来越少。
太好了！非常感谢，它很有效。我不太在意IEs，好的是它们越来越过时了。如果客户投诉，我会通过ifIE6或ifIE7样式表为其制作补丁。。。