webkit溢出滚动与css转换冲突

我在尝试在iOS上开发混合应用程序时遇到了一个严重的问题。问题是我使用了

flex-direction:column-reverse

，以便在消息中显示回复。一切正常，但我需要

translate3d

或

translateZ

黑客在收到事件时更新回复。不管怎么说，我这么做了，一切都很好，但是。。当我启用

-webkit溢出滚动：touch

时，内容会变得疯狂。一切正常，但内容定位错误。如果我将

flex-direction:column reverse

更改为

flex-direction:column

一切正常，但我希望以完全相反的方式排列顺序（这样，当收到新消息时，我也受益于“始终底部”的定位）

如果您有iOS设备，请检查：：这里比在JSFIDLE上更容易看到。继续横向定位，看看“回复”的定位会发生什么

如果我将

flex direction:column reverse

切换到

column

，一切正常，但布局不是我想要的

如果我删除

translate3d

或

translateZ

选项，一切都正常，但更新不会渲染（除非我将元素从视口中滚动出来，以便可以重新渲染它们）

如果我删除

-webkit overflow scrolling:touch

，同样，一切都很好，但是，正如您可能知道的那样，处理滚动会非常奇怪

有什么想法吗？

可能相关：