Jquery 如何在列中设置多个列表的样式？

我有一些无序列表（）

我现在对2列的工作解决方案是：

<div class="catalog_menu_widget">
<ul>
    <li>LOREM IPSUM</li>
    <li>LOREM IPSUM</li>
    <li>LOREM IPSUM</li>
    <li>LOREM IPSUM</li>
</ul>
<ul>
    <li>LOREM IPSUM</li>
    <li>LOREM IPSUM</li>
    <li>LOREM IPSUM</li>
</ul>
</div>

.catalog_menu_widget {
    width: 820px;
    padding: 10px;
    background: #e4e8fe;
    float: left;
}

.catalog_menu_widget ul {
    width: 410px;
    float: left;
}

.catalog_menu_widget li {
    line-height: 25px;
}

.catalog_menu_widget a {
    font-size: 14px;
    color: #003769; 
    text-transform: uppercase;
    /*font-weight: bold;*/
}

---

在标记

jquery

时，请尝试以下操作：

$(document).ready(function(){
    var $width = 100 / $('.catalog_menu_widget ul').length;
    $('.catalog_menu_widget ul').css({width: $width + '%'});
})

像这样的东西怎么样。设置

minwidth

属性也允许布局响应

如果要手动输入

Li

width%值，jQuery是多余的

CSS

HTML

---

非常感谢。对我有用。我把你的代码放在我的起始帖子“解决方案”下。

$(document).ready(function(){
    var $width = 100 / $('.catalog_menu_widget ul').length;
    $('.catalog_menu_widget ul').css({width: $width + '%'});
})

h2 {
    font-weight:bold;
}
.cols li{
    float:left;
    min-width:100px;
}

<ul class='cols'>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
</ul>

var cols=3;
$('.cols li').css({width:+100/cols+'%'});