Заставить столбцы flexbox быть равными в контейнере `flex-direction: column`

Question

Как сделать так, чтобы ширины столбцов Flexbox были равны (максимум всех столбцов) в контейнере flex-direction: column? Я не хочу явно устанавливать ширину, используя flex-basis, width свойства.

JSFiddle: https://jsfiddle.net/suthanbala/1u9gtqkm/6/

.row{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.column{
  border: 1px red dashed;
}

<div class="row">
  <div class="column">
    Small Content
  </div>
  <div class="column">
    Medium Content Medium Content
  </div>
  <div class="column">
    Large Content Large Content Large Content
  </div>
</div>

Answer 1

Если вы хотите, чтобы все столбцы были такими же широкими, как самый большой, вы можете сделать контейнер inline-flex и удалить элементы выравнивания:

.row{
  display: inline-flex;
  flex-direction: column;
}

.column{
  border: 1px red dashed;
}

<div class="row">
  <div class="column">
    Small Content
  </div>
  <div class="column">
    Medium Content Medium Content
  </div>
  <div class="column">
    Large Content Large Content Large Content
  </div>
</div>

Answer 2

Просто удалите align-items: flex-start;