css – 用于将最大子宽度指定给其他子宽度的Flex框

我有一群孩子的宽度应该相似.要将具有最大宽度的简单孩子分配给其他孩子.我尝试使用flexbox但无法获得它.是否有可能在flex框中实现或者我应该选择JS解决方案.请参考我尝试过的示例.请不要发布任何 javascript答案.

.flex{
  display:flex;
  flex-direction:column;
  align-items:baseline
}
.flex > div{
  background:#aaa
}

<div class="flex">
  <div>
      Text to check
  </div>
    <div>
      Text to check for similar width
  </div>
   <div>
      Text to check for similar width - will it work
  </div>
</div>

使用display：inline-flex;并给予物品宽度100％.

.flex{
  display:inline-flex;
  flex-direction:column;
  align-items:baseline
}
.flex > div{
  background:#aaa;
  width: 100%;
}

<div class="flex">
  <div>
      Text to check
  </div>
    <div>
      Text to check for similar width
  </div>
   <div>
      Text to check for similar width - will it work
  </div>
</div>

更新,感谢@vals comment

或者更改为align-items：在容器上拉伸并放下宽度：100％在项目上.

.flex{
  display:inline-flex;
  flex-direction:column;
  align-items:stretch;
}
.flex > div{
  background:#aaa
}

<div class="flex">
  <div>
      Text to check
  </div>
    <div>
      Text to check for similar width
  </div>
   <div>
      Text to check for similar width - will it work
  </div>
</div>