CSS3翻译%单位？

Question

以下是我想做的事

我有一个球体，它的顶部边缘比它的容器b的顶部低50%。我想用一个平移的方法来移动它，它位于球体的地板上。

这是我试过的

.ball
{
 position:absolute;
 left:25%;
 top:50%;
 height:80px;
 width:80px;
 -webkit-animation:fall 3.4s normal forwards ease-in-out;
}

@-webkit-keyframes fall
{
 0%{-webkit-transform:translateY(0%);}
 100%{-webkit-transform:translateY(100%);}
}

我看到的最终结果是非常出乎意料的--用PicPick像素尺测量下降的范围，表明下降了80 to，即100%对应于球的高度。通过使用像素单位，我可以让球通过我所指示的精确像素距离，但这不是我需要做的。

我怀疑我还没有完全理解这里所涉及的问题。我非常感谢你的帮助。

Answer 1

简单的回答--这实际上是正确的行为。如果要在翻译转换中使用相对单位，请考虑使用视口长度单位。