Html 如何使导航条在没有绝对定位的情况下浮动到集装箱div的左侧

我试图让导航栏位于容器div（和标题img）的左侧，而不必按像素定位（如代码笔中所示：）。 我希望设计能有响应性，所以我希望将主分区（容器/收割台img）居中，让导航挂在左侧，但我没有运气做到这一点

---

谢谢大家!

您必须保持HTML结构不变吗？您可以按如下方式执行此操作：

<div class="wrap">
  <div id="nav">
    <ul>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
    </ul>
  </div>

<div id="body">
    <img src="http://placehold.it/600x150" />

    <div id="container">
      <img src="http://placehold.it/600x800" />
    </div>

</div>
</div><!--//end wrap-->

---

您可以调整#nav的上边距，使其向下倾斜

我举了一个例子。我使用了显示表的方法。这是一把小提琴

[小提琴][1]

---

你说的“反应性地流动”是什么意思？如果调整浏览器的大小，布局应该如何更改？非常好！非常感谢你。

.wrap { 
  overflow: hidden;
  width: 800px;
  margin: auto auto;
}

#nav { 
  width: 160px;
  float: left;
}

#body {
  width: 80%;
  float: left;
}

display:table