Question

如果你有一个父容器设置为宽度：100％，并且你的部分都应该是相等的，但百分比是一个奇数，如16.666667％，你如何确保它正确显示没有休息？小数位的限制是什么？

实施例：

<ul>
     <li>One
     <li>Two
     <li>Three
     <li>Four
     <li>Five
     <li>Six
</ul>

并且ul的宽度为100％，所有的li都向左浮动。现在将100除以6得到16.66666666667％。如果我想要一个右边边框：1px纯黑色;你如何用CSS来解决这些问题？我可以理解这是所有数学，但你不能从一个百分比减去1px（据我所知，也许你可以...）

那你怎么做这些事情？谢谢！

Answer 1

嘿，我想你想要这个你可以定义你的ul display:table并定义你到display:table-cell;就像这样

<强>的CSS

div{
width:500px;
    border:solid 1px red;
    margin:0 auto;

}

ul{
width:100%;
    background:green;
    display:table;

}

ul li{
display:table-cell;
    border-right:solid 1px white;
    padding:10px;
}
ul li:last-child{border:none;}

<强> HTML

<div>
<ul>
    <li>One</li>
     <li>Two</li>
     <li>Three</li>
     <li>Four</li>
     <li>Five</li>
     <li>Six</li>
</ul>
</div>

现场演示http://jsfiddle.net/rohitazad/gjutz/1/

分割宽度的最佳方法是什么：100％父容器分成带小数的部分？

1 个答案: