<div>
<ul>
<li>First</l1>
<li>Second</li>
<li>Third</li>
<li>Fourth</li>
</ul>
</div>
div {
width: 100%;
}
li {
list-style: none;
float: left;
}
使用CSS,有没有办法让LI标签自动均匀地填充父div的整个宽度？所以他们每人占25％.
将’width’指定为25％显然会起作用,但这不是我追求的解决方案.有问题的菜单是动态创建的,有时会创建和删除新项目.
干杯
解决方法
我认为你有三个选择：
>使用JavaScript计算大小
>使用表格,如this question中所讨论的(这实际上不是一个糟糕的选择 – 它是纯HTML和CSS
>如果您只定位新浏览器,则可以使用CSS的新flexible box组件(此处显示了几个供应商前缀)：
ul{
padding: 0;
display: -webkit-Box;
display: -moz-Box;
display: Box;
}
li{
list-style: none;
list-style:none;
text-align: center;
-webkit-Box-flex: 1;
-moz-Box-flex: 1;
Box-flex: 1;
}
