Flexbox证明内容在一侧有填充或边距

Question

我想了解更多关于flexbox的信息。所以，我给自己的项目只能在flexbox中制作。

现在我正在尝试制作一个上面有2个项目的栏，一个占据栏宽度的50％，另一个占100％，结果如下图所示。

_____________ X___________X（条形图继续在X下方）

我以为我可以用

来解决这个问题

    .parent {
        display: flex;
    }
    .parent .item-child {
        display: flex;
        justify-content: space-between;
    }
.parent .item-child:first-child {
     padding: 50%;
}

在我看来，必须有更好的方法。