Chrome和Safari中的对齐内容行为

Question

我遇到了justify-content在Chrome（第47版）和Safari（第9版）中显示不同结果的问题。

在Chrome中，foreignobject内的文字溢出到左侧，但在Safari中溢出到右侧。

这是我的理解

    justify-content: flex-end;

应该将文本与右侧对齐并向左溢出（就像在Chrome中一样）。我正努力让Safari做同样的事情。

https://jsfiddle.net/g27poLd0/3/