使用flexbox将div与另一个左对齐的兄弟div水平居中

Question

我想水平居中一个div，同时将另一个保持在左侧，如下图所示：

我设法通过混合flexbox方法（将B div居中）同时在div A上使用position: absolute; left: 20px（并将父容器设置为position: relative）来获得所需的布局，如上所示，但我不喜欢使用position: absolute，感觉就像是古老的样式。

如何在没有position技巧的情况下使用纯Flexbox做到这一点？

请注意，内部div（A）和（B）的大小先验未知，理想情况下，div的宽度应适合内容（如上所示）。