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

Question

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

实施例

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

这是我在JSfiddle上的一个示例结构，任何想法如何使用flexbox实现这一目标？

Answer 1

https://jsfiddle.net/04Lzxqun/2/ 去掉   显示：flex;   证明内容：flex-end; 从 .Parent 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;
}