CSS：混合混合模式使转换不再起作用（Chrome，Firefox）

Question

似乎mix-blend-mode: multiply让任何transform不再工作。这种情况发生在 Chrome 和 Firefox 中，而在 Safari 中却可以。（全部更新到最新版本）

在此小提琴中，您可以看到行为：小提琴 （抱歉，如果有点混乱，我不是开发人员）

第一张图片没有multiply班级，第二张图片有班级。

.inner {
  -webkit-transform: translateZ(30px);
  transform: translateZ(30px);
}

.innerUp {
  -webkit-transform: translateZ(100px);
  transform: translateZ(100px);
}

.multiply {
  mix-blend-mode: multiply;
}

我发现了一些关于此的讨论，但没有一个能够解决这个问题。

谢谢！