带有 link 和 <i> 的 translateX

Question

我想向右进行 5 像素的短 translateX 过渡。我想我的显示器有问题。所有其他过渡都有效，只有这个无效...

这是我的代码：

#content a.shake {
  display: inline-block;

  -moz-transition: .5s ease-in-out;
  -webkit-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  -ms-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
}

#content a.shake i {
  display: inline-block;
}
#content a.shake:hover {
  display: inline-block;

  -webkit-tranform: translateX(5px);
  -moz-tranform: translateX(5px);
  -o-tranform: translateX(5px);
  -ms-tranform: translateX(5px);
  tranform: translateX(5px);
}

<a class="shake" href="#">Choisissez un prestataire<i class="icon-arrow"></i></a>

Answer 1

你打错了：transform，不是 transform[=10x12=]transform: translateX(5px);

带有 link 和 <i> 的 translateX

translateX with a link and a <i>

css

transition

translate-animation