您可以将flex: 50%给孩子div s，而无需触摸.item

.item {
  width: 100%
}

.container {
  display: flex;
  flex-wrap: wrap;
}

.container > div {
  flex: 50%; /* or - flex: 0 50% - or - flex-basis: 50% - */
  /*demo*/
  box-shadow: 0 0 0 1px black;
  margin-bottom: 10px;
}

<div class="container">
  <div class="item">1</div>
  <div class="item">2</div>
  <div class="item">3</div>
  <div class="item">4</div>
</div>

下面的解决方案对我有效

.parent{
  display: flex;
  flex-wrap: wrap;
}

.child{
  width: 25%;
  box-sizing: border-box;
}

样本：https://codepen.io/capynet/pen/WOPBBm

假设width属性不能改变，我可以想到几个可能的解决方案，第一个是fit-content，它的浏览器支持非常差。第二个是use positioning，这是一个同样糟糕的主意，因为它的挑剔本质和在不同屏幕尺寸上失败的可能性。
现在最后两个，非常相似，一个是使用两个容器，给予它们display:inline;给它们一个有限的宽度，然后用项目填充它们。如果你没有注意到，这本质上是一个2×1的表。
最后，你可以做一个2×1的表格，虽然这可能是这里最简单的解决方案，但养成使用表格来放置表单和表格以外的东西的习惯是一个坏主意。然而，这是我将提供给你的一个选项。
祝你好运！