Html 浮动内嵌块和非浮动内嵌块之间的布局差异

我试图在一个容器中实现4个水平内联块的简单布局

HTML：

<div id="wrapper">
    <ul id="myList">
        <li><p>1</p></li>
        <li><p>2</p></li>
        <li><p>3</p></li>
        <li><p>4</p></li>        
    </ul>
</div>​

看。尽管李的尺寸看起来很合适

(130px + (2 * 5px) + (2 * 10px) = 640px)) * 4 = 640px

。。。第四个区块向下推至下一行

如果我添加一个浮点数，则li只适合水平方向：左；去李家-看看

---

不知道有没有人能解释一下这是怎么回事？我本以为浮子：左；因为内联块的尺寸与li的配合，所以没有必要这样做吗？多谢各位

显示：内联块将考虑周围的任何空白。因此，li元素之间的换行符会影响宽度

固定示例：

---

编辑：关于此问题的深入文章：

显示：内联块将考虑任何周围的空白。因此，li元素之间的换行符会影响宽度

固定示例：

---

编辑：关于该问题的深入文章：

这已经被删除。内联块不能浮动。浮动元素的那一刻，它始终呈现为块级别框，而不是内联级别的块框。感谢您的评论-我将研究这些问题/答案，以尝试了解它。这一直是。内联块不能浮动。当你浮动一个元素的时候，它总是呈现为一个块级框，而不是一个内联的块级框。谢谢你的评论-我会研究这些问题/答案，试着了解一下。太好了-感谢你的解释和我将研究的文章的链接。谢谢。非常感谢你的解释和文章的链接，我将学习。非常感谢。

(130px + (2 * 5px) + (2 * 10px) = 640px)) * 4 = 640px