svg矢量圖在flex佈局中樣式扭曲的問題

問題機型

• 小米5
• 華爲nova
• 其餘未知的可能機型

問題描述

利用flex 佈局的一行中，
左同樣式：

-webkit-box-flex: 0;
    flex:  0 1 auto;

左二樣式：
-webkit-box-flex: 1; flex: 1 1 0%; width: 0px;
svg 所在的箭頭的樣式使用的是：

width: 8px;
     position: relative;

箭頭要麼缺了一塊，要麼乾脆消失了。

解決

在svg元素上加上： transform: translate3d(0, 0, 0);