基本上，我有一个组件可以使页面从底部向上滑动并占据高度80%。在此组件中，我有一个modal组件。当我打开该模式时，它不会像应有的那样占据整个页面。我跟踪了使用transform: translateY()作为动画滑动的原因。如果我删除转换，则模态会填满整个页面。
我做了一个简化的提琴，以解决这个问题：https://jsfiddle.net/70yopxg6/2/
请注意，使用transform: translateY(0)设置转换会为滑动动画，但是模态不能正确打开。如果我们将转换设置为transform: none，那么它就可以工作。但是，如果我除了translateY之外还应用了其他转换，该怎么办？在不清除所有转换的情况下该怎么办？我也想知道为什么会这样。
我正在使用Chrome 70。
谢谢