对齐flexbox布局中行*和*列中的单元格

Question

有没有办法使用flexbox 对齐行和列中的单元格(如表中)？

为了清楚起见,我想要的是对齐下表中的单元格.

当然我可以添加一些,flex: XXX但问题是我不想修复列的宽度.

我已经习惯了修复所有东西,但我觉得有点卡住...所以除了回到display: table或者html 之外没有解决方案<table>......？

如果你想玩它,这是一个小提琴 :)

.myCell {
  border: solid black 1px;
  padding: 10px;
}
.myTable {
  display: flex;
  flex-direction: column;
}
.myRow {
  display: flex;
  flex-direction: row;
}

<div class="myTable">
  <div class="myRow">
    <div class="myCell">ROW 1, CELL 1</div>
    <div class="myCell">ROW 1, CELL 2</div>
    <div class="myCell">ROW 1, CELL 3</div>
  </div>
  <div class="myRow">
    <div class="myCell">A LONGER CELL</div>
    <div class="myCell">ROW 2, CELL 2</div>
    <div class="myCell">ROW 2, CELL 3</div>
  </div>
</div>

Answer 1

对于未来的更换CSS Table是CSS Grid,没有Flexbox.

也就是说,你可以使Flexbox表现为一种表,但不能完全替换它,并且当你似乎寻找列/行布局时,使用CSS Table(并且不会返回)