Css 为什么float left在这里不能按预期工作？

我原以为图片在列表的右边，但没有

<main class="works">
    <div class="izq">
      <nav>
                <li><a class="" href="/app_dev.php/works/35">eeeee</a></li>
                <li><a class="" href="/app_dev.php/works/36">fasdf</a></li>
      </nav>
    </div>
    <section>
        <img src="http://www.seobook.com/images/smallfish.jpg">
        <img src="http://www.seobook.com/images/smallfish.jpg">
    </section>
</main>



.works {
    width: 600px;
}
div {
   float: left;   
}
section {
    float: left;
}

---

这似乎是个问题——没有足够的空间来维持浮动，即600px没有足够的水平空间来“容纳”浮动时的图像。增加或删除600px分配。

您需要为.section类提供宽度

---

实验室：

请再次检查小提琴-已删除.works的CSS，但仍然不变。。我的意思是问题仍然存在。增加浏览器窗口的宽度。不用担心，一点也不：

.works {
    width: 600px; <--- not enough space to maintain float
}