div旋转动画为什么以下代码实现不了？
.image_2 figcaption div
{
border:2px solid #fff;
width: 80%;height: 80%;
position: absolute;
top: 10%;left: 10%;
-webkit-transform:translate(0px, 0px) rotate(0deg);
-moz-transform:translate(0px, 0px) rotate(0deg);
transform:translate(0px, 0px) rotate(0deg);
}
.image_2:hover figcaption div
{
border:2px solid red;
-webkit-transfrom:translate(0px, 0px) rotate(720deg);
-moz-transfrom:translate(0px, 0px) rotate(720deg);
transfrom:translate(0px, 0px) rotate(720deg);
}
为什么div中的边框不能实现旋转了呢？鼠标选中的时候，边框的颜色变了，可是没有旋转的效果。求教，困扰了几天的问题（我使用的是chrome的最新浏览器），谢谢。
