根据父标题居中对齐内容到右侧

Question

我正在使用 flexbox 构建表格，但遇到了对齐问题。我希望能够将我的内容向右对齐，但我的标题居中。

例子

____________
|   Test   |
|----------|
|     $1   |
|----------|
|   $312   |
|----------|

这是我在JSfiddle 上的一个示例结构，知道如何使用 flexbox 来实现吗？

Answer 1

https://jsfiddle.net/04Lzxqun/2/ 消除 显示：弯曲； 证明内容：弹性结束； 从 .父div

.table{
  display: flex;
  flex-direction: row;
}
.parent{
  flex-direction: column;
  border: 1px solid black;
  flex-basis: 1 0 50px;
  width: 100%;
}

.parent div {
  border: 1px solid black;
}
.parent span{
  text-align: left !important;
}
.parent .header{
  text-align: center !important;
}

.header {
  background-color: blue;
}

.empty{
  visibility: hidden;
}