translateX 带有一个链接和一个 <i>答案

【问题标题】：translateX with a link and a <i>translateX 带有一个链接和一个 <i>
【发布时间】：2015-08-17 22:02:15
【问题描述】：

我想在右边做一个 5px 的简短 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);
}

&lt;a class="shake" href="#"&gt;Choisissez un prestataire&lt;i class="icon-arrow"&gt;&lt;/i&gt;&lt;/a&gt;

【问题讨论】：

工作得很好。您的问题是因为transform 中缺少s 吗？
真丢脸！谢谢@Abhitalks，这正是因为我错过了一个“s”......

标签： css transition translate-animation

【解决方案1】：

你有一个错字：转换，而不是转换

转换：translateX(5px);

【讨论】：