是否可以使用flexbox复制表？

Question

我试图使用flexbox创建一个表，但我现在有点卡住了。

我可以使整个表格对齐 - 并使列对齐，但我不确定如何让列和行匹配。

这是我到目前为止所做的事情 - 这个例子显示了我失败的确切位置：

https://jsfiddle.net/10Lfd5wp/

<div class="flex-table">
    <div class="item">
        <div>Name</div>
        <div>ASP.NET_SessionId</div>
        <div>visit</div>
    </div>
    <div class="item flex">
        <div>Usage</div>
        <div>Identifies a session (visit), and allows user specific data to be preserved across pages and page updates.</div>

.flex-table {
  /* 2009 spec */
  display: -webkit-box;
  /* 2012 spec */
  display: -webkit-flexbox;
  display: -ms-flexbox;
  /* Standard spec */
  display: -webkit-flex;
  display: flex;
  border: solid 0.1rem rgba(0, 0, 0, 0.12);
}
.flex-table .item > * {
  padding: 0.8rem;
}
.flex-table .item > *:first-child {
  background-color: #fafafa;
}
.flex-table .item > * ~ * {
  border-top: solid 0.1rem rgba(0, 0, 0, 0.12);
}
.flex-table > .item ~ .item {
  border-left: solid 0.1rem rgba(0, 0, 0, 0.12);
}
.flex-table .item.flex {
  /* 2009 spec - limited */
  -webkit-box-flex: 1;
  /* 2012 onwards */
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}