HTML 定位 : Postion two objects relative to a third object without disrupting the flow

Question

好吧，所以这很难解释，所以如果我不清楚，请提问

在我的 html 页面中，我有一个主“容器”div，其中有多个 div，但容器内的每个 div 都被放置在两列之一中(因此，如果容器中有一个 div，它要么在左栏要么在右栏)

<div id="container">
  <div id="column1">
    <div id="item1-1"></div>
    <div id="item1-2"></div>
    <div id="item1-3"></div>
  </div column1>
  <div id="column2">
    <div id="item2-1"></div>
    <div id="item2-2"></div>
    <div id="item2-3"></div>
  </div column2>
</div container>

[注意:我知道语法不正确，我只是让它更容易阅读]

因此，换句话说，我想要两列大小可以变化的 div(因此页面大小可以变化)，以便 item1-2 出现在 item1-1 下方，等等。这里的问题是我想要容器中的 div 出现在其中，所以我不能使用绝对或相对定位。有些东西告诉我应该使用表格，但我不确定如何去做。

所以，我的问题是:仅使用 html 和 css，是否可以完全按照上面的方式进行操作？

Answer 1

首先:制作</div column1>和 </div column2>就说</div>

第二个:CSS:

#container {
    width: 100%;
}

#column1, #column2 {
    float: left;
    width: 50%;
}