Css Safari使用固定位置和变换矩阵扭曲元素中的内容

我意识到一个元素中的所有内容都带有样式

position:fixed

和

transform:matrix

是扭曲的，当然，除了将

位置

更改为

fixed

之外，到目前为止我找不到任何解决方案

在Safari v10.1.2上测试

这是一幅图像：

以下是html：

<div class="first fixed">
    Fixed element  
</div>

<div class="second ">
   Static element
</div>

和演示：

div {
  width: 200px;
  padding: 10px;
  background-color: yellow;
  border: 1px solid black;
}

div.first {
  background: steelblue;
  transform: matrix(3, 0, 0, 3, 300, 100); /* Standard syntax */
}

div.second {
  background: orange;
  transform: matrix(3, 0, 0, 3, 300, 250); /* Standard syntax */
}

.fixed {
  position:fixed;
}