Html 双柱柔性箱布局

我需要创建布局，其中将包含两列中的项目列表。就像我在下面展示的：

.container{
边框：1px纯红；
高度：300px；
显示器：flex；
弯曲方向：立柱；
调整内容：灵活启动；
柔性包装：包装；
}
.项目{
边框：1px蓝色虚线；
高度：50px；
}

1.
2.
3.
4.
5.
6.
7.
8.

您可以设置项目的最大宽度，等于50%。这将使它几乎保持相同的宽度。我说几乎是因为你也设定了边界

为了保持宽度完全相同，还必须为项目设置框大小：边框框

因此，您的代码将是：

.item {
  border: 1px dashed blue;
  height: 50px;
  box-sizing: border-box;
  max-width: 50%;
}

.container{
边框：1px纯红；
高度：300px；
显示器：flex；
弯曲方向：立柱；
调整内容：灵活启动；
柔性包装：包装；
}
.项目{
边框：1px蓝色虚线；
高度：50px；
框大小：边框框；
最大宽度：50%；
}

1.
2.
3.
4.
5.
6.
7.
8.

使用弹性基础：儿童50%。弯曲方向：行；和柔性包装：包装；在父母身上。这也是一个非常有用的入门指南：