-1

感谢您的回答，显然我在数学上犯了一个可怕的错误......

这是我的代码。

<div>
    <p>1</p>
    <p>2</p>
    <p>3</p>
</div>

<style>
div {
    overflow: hidden;
    width: 300px;
    background: blue;
    margin: 0;
    padding: 0;
}
p {
    margin: 0;
    padding: 0;
    float: left;
    width: 30%;
    height: 100px;
    background: red;
}
</style>

渲染后， 的宽度p是90px而不是100px。我在最新版本的 Chrome、Safari、Opera、Firefox 上进行了测试。都得到了相同的结果。为什么？ jsfiddle 上的演示

4

2 回答 2

3

宽度实际上是 96px。

.3 * 320 = 96

你会接近你想要的33.33

http://jsfiddle.net/s2Lbm/

于 2013-09-20T13:28:22.303 回答
2

因为 100/3 = 33.33333 所以将宽度设置为 33.33%

于 2013-09-20T13:28:44.047 回答